基金訓練に行ってきました。(46日目)


基金訓練(Webデザイン・プログラミング科)の46日目に行ってまいりました。
本日は、HTML&CSSプログラミングの実習です。

本日の内容は下記のとおりです。

1.CSSのスタイル属性(プロパティ)

テキスト、フォントに関するスタイル属性

文字の大きさ

プロパティ
font-size
  • 長さ(単位付数値)(絶対及び相対指定)
  • xx-small  超極小(絶対指定)
  • x-small  極小(絶対指定)
  • small  小(絶対指定)
  • medium  標準(絶対指定)
  • large  大(絶対指定)
  • x-large  特大(絶対指定)
  • xx-large  超特大(絶対指定)
  • smaller  より小さく(相対指定)
  • larger  より大きく(相対指定)
  • %  親要素に対するパーセンテージ(相対指定)

文字の書体

プロパティ
font-family
値(複数指定可能で「,」で区切って指定)
  • 系列別(serif、sans-serif等)
  • フォント名(“MS P ゴシック”、Osaka等)

※スペースを含むフォント名の場合は、「”」で囲む。
 ※日本語のフォント名の文字は全角で、スペースは半角にする。

文字の太さ

プロパティ
font-weight
  • normal  標準
  • bold  太字表示
  • bolder  より太く表示
  • lighter  より細く表示
  • 100~900  100刻みで指定

文字のイタリック体、斜体表示

プロパティ
font-style
  • normal  標準
  • italic  イタリック体で表示
  • oblique  斜字で表示

※イタリック体は、筆書形の右に傾いた書体で、元の書体とはデザインが違ったもの。
 ※斜体は、字形をそのまま斜めに傾けたもの。

行送り

プロパティ
line-height
  • 長さ(単位付数値)
  • 実数値(単位なし数値)  フォントサイズに対する倍数
  • normal  標準(フォントサイズに基づいてブラウザが設定した規定値)
  • %  フォントサイズに対するパーセンテージ

文字の色

プロパティ
color
  • カラーの値

※ブロック要素に指定可能。

段落の行揃え

プロパティ
text-align
  • left  テキストを左揃えにする
  • right  テキストを右揃えにする
  • center  テキストをセンター揃えにする
  • justify  行内で均等配置にする

文字の装飾

プロパティ
text-decoration
  • none  標準
  • underline  下線をつける
  • overline  上線をつける
  • line-through  取り消し線をつける
  • blink  点滅させる

※blinkは、Firefox、operaのみ有効。
 ※2つ以上の値を半角スペースで続ければ、同時に指定できる。


今日のポイント

  • line-heightを指定した時、フォントの上下に均等に隙間が開くので、例えば、
    font-size:10px;line-height:14pxの時、上下に各2pxの隙間があく。


関連記事

カテゴリー:職業訓練
.

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください