7月の授業日記

6/25 ナビゲーションのフロート

ライブビューでのブロック挿入

  • 囲む>選択したタグの親要素として挿入
  • ネスト>洗濯したタグの子要素として挿入

ナビゲーションのフロート

  • ナビゲーション内だけに指定できる様子孫セレクタで限定する

7/2 セレクタのおさらい

新規 article の内容がここに入ります

グループセレクタ

  • 複数のセレクタに同一指定 

子孫セレクタ

  • 特定の親要素のセレクタに限定

擬似クラスセレクタ

  • 状態をセレクタに

box-sizing

  •  border-boxにするとwidthの値にpadding,borderを含まず簡単に指定できる
新規 article の内容がここに入ります

7/9 トップページデザイン

background-repeat

repeat 

タイル状に繰り返す

 repeat-x

横方向のみリピート

repeat-y

 縦方向のみリピート

デザインカンプ  

 実装を伴わないデザインのみの完成版

  1. デザイン
  2. コーディング(html)

の流れで作ることで

  • デザイン修正に伴うhtml修正を防ぐ
  • htmlに縛られずデザインできる
  • コーダーと役割分担ができる 

XD 

  •  サイト単位でリンク付きでデザインカンプが作成できる
  • 画像処理はPhotoshopの方が高機能 

今日の一言 

今日の授業で画像を埋め込んだことで一気に自分のページ感が増したように思え、少し達成感を覚えました。 

7/2 セレクタのおさらい

数値化

  • html/CSSで指定するには値の数値が必要 
    • XD等ではパネル 
    • PSではCSSのコピー等 
    • DWはドラッグでプレビューしながら再現可能 
新規 article の内容がここに入ります