模擬サイト作成8/ HTML ・・
HTML・・
日付とタイトルはテキストボックスを分ける。<time>タグと<p>タグで実装するため。
バツ印実装簡単な方法
テキストの×を利用する方法
html <div class="batsu">×</div>
CSS .batsu{
font-size: 400%;
font-weight: bold;
}
span要素
特定の範囲(フレージング・コンテンツ(inline要素))を1つのグループとしてまとめる。この要素自体は特別な意味を持たない。
つまり、<div>を使わないで、インライン要素をまとめることができるタグってことかな。。
Figma・・
コンポーネント
(復習)よく使うオブジェクトをコンポーネント(UIの部品)にしておいて、それのインスタント(コピー)を使い変更を加て使用する。
オートレイアウト
アイコンの並びなど、よく使う一つのまとまりをグループ化(⌘G)、右サイド詳細欄に"Auto Layout"が出現するのでクリックで適用、変更があった際にはここで調整できる。
e.g.)
Prototype作成
遷移先のオブジェクト作成後に、実際の動作をつけたプロトタイプを見ることができる作成ツール。オブジェクトの外枠に出る丸印から遷移を書き、開いた"Interaction Details"から詳細設定を行う。
Tip・・
CheatSheetアプリでショートカットが楽になる。⌘長押し。
この記事が気に入ったらサポートをしてみませんか?