HTML&CSS　学び　3

CSSとのつなげ方

フォント文字の設定

　font-family: sans-serif; = ゴシック体で表示

　font-family: serif = 明朝体で表示される

　※ほかにもあるがそれは調べればでできます。

文字のサイズを指定する

　font-size: 数字px;で変わる

　サイズの指定ではほかにも方法があります

　%(親要素のサイズをもとに設定される)

　em(親要素のサイズをもとに設定される)(1em=100%)

rem(ルート要素のサイズをもとに設定)(1rem=100%)

親の要素とは

　bodyのfont-sizeのこと

　ex.bodyが20pxとします子要素が50％とします

　子要素が表示されるのは20X0.5=10pxとなり表示されます。

　1emは100%で表示されますのでex.0.5emで50％で表示されることになります。

　1remはルート要素なのでHTMLタグからの比率で表示されます。

文字を太くする

　font-weight:(数字,normal,bold,ligher,bolder);で表示されます。

　数字はそのままです。

　normalは標準の太さです。

　boldは一般的な太さです。

　ligherは相対的に一番細い

　bolderは相対的に一段階太い

フォントのスタイル

　hont-style:(normal,italic,oblique);で表示されます。

　normalは標準のスタイル

　italicはイタリック体

　obliqueは斜め体

文字色の変更

　color:（英語で色の名前,カラーコード）;

テキストを中央揃え・左右揃え

　text-align:(left,right,center,justify);で表示されます。

　leftは左

　rightは右

　center中央

　justifyは全体を均等に配置する。

文字間隔を調整する（文字と文字の間隔を調整）

　letter-spacing:(数字,%,em<rem);

　文字のサイズ指定と同じです

フォントをまとめて指定する

　font:(font-style font-weight font-size/line-height font-family);

他のページリンクする

　<p>文字：<a href ="リンク先">ここの文字が表示され文字を押すとリンクに飛ぶ</a></p>

相対パスと絶対パス

　http://から始まるのは絶対パス！！

　今、表示されてる場所から飛ばしたいリンク先までを書いてあるのが相対パス

リンクを新しいタブ（ウィンドウ）で開く