あやふやな部分。
HTML分野
・インライン要素
→テキストデータや画像、a要素()など横並びでマークアップするテキストレベルの要素(=テキストデータとして扱われる)
・ブロック要素
→見出し、段落、箇条書き、表組みなど文書構造の骨組みを構成する要素
※ブロックレベルの要素はマークアップすると自動改行される
→概念的にはブロック要素は入れ物、インライン要素は中身
つまり…ブロック要素の中にインライン要素/ブロック要素(入れ物に中身)は入るが、
インライン要素の中にブロック要素(中身に入れ物)は入れられない!
☆もっとも手軽な見分け方→要素を記述した時に自動改行するかどうかで判断
section要素について
→開始タグと終了タグで囲まれた範囲を一つのまとまりと指定する要素
リンクの種類
①ページ内リンクはid属性(要素に固有の識別名を指定する属性)を使って設定する
ex:)<section id=”aaa”>…<a href=”#aaa”></section>
→1. section要素にid属性を使って固有の識別名”aaa”を与える
→2. a要素のhref属性に「#+リンク先id」を記述
②内部リンクはhref属性内に目的ファイルまでのパスを記述する
ex:)<a href=”../profile.html”>aaa</a>
→同じタブ内でリンク先ファイルを開く
③別のサーバにある外部Webページ(外部リンク)
ex:)<a href=”http://www.yahoo.co.jp ”target=”_brank”>yahoo!トップページへ</a>
→新規ウィンドウ/タブでリンク先ファイルを開く(target=”_brank”)
CSS分野
・text-align:centerとmargin:0 autoの違い
text...は文字や画像をBoxに対して中央揃えにすること
marginは横幅のあるブロック要素が親Boxに対して中央揃えにする
・ボーダーまたは背景色が設定された要素に対して設定するもの
padding(見やすくするため)
・marginとpaddingの認識について
・ショートハンドとは:関連プロパティはプロパティ毎に一括指定することができる
ex::)
①margin/paddingプロパティ
margin: A;:上下左右すべてAの値だけ余白を指定
margin: AB;:上下(A)左右(B)の値だけ余白を指定
margin: ABC;:上(A)左右(B)下(C)だけ余白を指定
margin: ABCD;:上(A)下(B)左(C)右(D)だけ余白を指定
②borderプロパティ
border-width: 1px;
borderstyle: solod;-
border-color: #fff;
→border: 1px solid #fff;(順不同)
③backgroundプロパティ
background-image:url(original/header_herbkitchen.jpg);
background-position: left top;
background-repeat: no-repeat;
→background:url(../original/header_herbkitchen.jpg) left top no-repeat;(順不同)