毎日デザイン@Web

デザインの勉強は一日にして成らず。日々の積み重ねでちょっとずつ前進。職業訓練校でWebサイト制作の勉強中です。

CSS基礎 6/25(木)

◆授業内容 

  • CSSによる背景画像設定のプロパティ

    background-image:url(相対パス/ファイル名)

  • 背景の繰り返し(background-repeat)
  • px、em、%での行高の設定(line-height)

 

◆所感

今日は 演習中心の授業でした。昨日まで分からないところを調べまくった成果か、比較的内容を理解した上でCSSを書くことができました。

悩んだポイント

<img>等の、空タグにおける閉じ『/>』の扱い

HTML4までは無いとエラーが出る為必須だった。HTML5では記述を省略できる仕様になった。


<link rel="stylesheet" href="相対パス"  type="text/css">の意味
  • relはrelation(関係)で、リンク先のファイルが、当該htmlに対してどういう関係のものかを表す。
  • hrefはhyper reference(超+参照)のことで、外部ファイルの参照先を指定する。
  • typeはこの場合、リンク先のスタイルシートの種類がCSSであることを表している。スタイルシートCSS以外の形式のものも存在するため。HTML4以前は、指定の必要があったが、HTML5では記述がない場合、自動でCSS扱いと認識される。
コメントアウトの記述方法の違い
  • HTMLの場合 ⇒ <!--コメントを記述-->
  • CSSの場合 ⇒ <*コメントを記述*>

私はVBAをかじっていた関係で、コメントアウトの方法は『’』だけだと思っていましたが、言語によって記述が異なるようです。

no-repeat設定時の背景画像の中央配置

background-positionで指定できるようです。

参考サイト⇒ background-position 背景画像の位置指定

◆課題

 特になし。

 

おまけ

前々々回の小テスト回答編

  1. Hyper Text Markup Language
  2. .html
  3. テキストエディタ
  4. 終了タグ
  5. <h1> <h2> <h3> <h4> <h5> <h6>
  6. <p>
  7. <ul> <li>
  8. <table> <tr> <th> <td>
  9. <!DOCTYPE html>  ※小文字でも可
  10.  <meta charset="UTF-8">

問題編はこちら⇒HTML・CSS基礎/Illustrator入門 6/22(月)、23(火) - 毎日デザイン@Web