■HTML基礎構造タグ
１．HTMLタグ
<head> ・・・ページ設定情報を記入
<body> ・・・ページのコンテンツを記入
２．見出しと段落
<h1> ・・・見出し、h1～h3まであり
<p> ・・・段落を示す
３．リスト表示
<ul> ・・・リストを示す。
<ol> ・・・順番のあるリストを示す
<li> ・・・リスト項目を示す
４．表を作成する
<table> ・・・表を示す
<tr> ・・・行を示す
<th> ・・・表見出し項目を示す
<td> ・・・表データ項目を示す
<thead> ・・・表ヘッダーを示す
<tbody> ・・・表ボディを示す
<tfoot> ・・・表フッターを示す
５．セクションや構造を示すタグ
<article> ・・・独立した記事のセクション
<section> ・・・セクション
<aside> ・・・本筋から外れる内容のセクション
<header> ・・・ヘッダー示す
<footer> ・・・フッターを示す
■CSSに記入するタグ
１．文字サイズを調整
font-size・・・文字サイズを指定する
２．文字の色と背景色を指定
color・・・文字色を指定する
background-color・・・背景色を指定する
３．枠線、空白を追加
border・・・枠線を追加
border-top・・・同上 上部のみ
border-bottom・・・同上 下部のみ
border-left・・・同上 左部のみ
border-right・・・同上 右部のみ
padding・・・枠線の内側に設定する
padding-top・・・同上 上部のみ
padding-bottom・・・同上 下部のみ
padding-left・・・同上 左部のみ
padding-right・・・同上 右部のみ
margin・・・枠線の内側に設定する
margin-top・・・同上 上部のみ
margin-bottom・・・同上 下部のみ
margin-left・・・同上 左部のみ
margin-right・・・同上 右部のみ
４．リストを調整
list-style-type・・・リスト記号を指定
list-style-image・・・リスト記号を画像で指定
list-style-position・・・リスト記号の位置を指定
list-style・・・上部をまとめて指定
５．表を調整
border-collapse・・・表の隣接セルの枠線の表示表法を指定
border-spacing・・・表の隣接セルの枠線と枠線の隙間の距離を指定
text-align・・・行揃えの配置を指定
font-weight・・・文字の太さを指定
width・・・横幅を指定
６．フォントと文字の高さを指定 font-family・・・フォントを指定
line-height・・・文字の高さを指定
■画像の表示
<img> ・・・画像を表示する
<figure> ・・・本文から参照される図をしめす。
例） <img> ～</img>を囲む形で<figure> ～</figure>を使用します
<figcaption> ・・・図のキャプションを示す。<figure>要素内でのみ使用可能
■コンテンツ内で使用するタグ
１．コピーライト挿入タグ
<small> ・・・細かい項目（免責条項、警告、著作権）であることを示す
２．コンテンツ内部の構造指定 <div> ・・・範囲を定義する汎用タグ
３．コンテンツレイアウト <time> ・・・日付を示す
float・・・要素を左、右に指定
content・・・floatプロパティを解除
display・・・疑似要素（:after :before）とともに用い、要素の直前または直後にコンテンツを指定
overflow・・・ブロックレベル要素かインライン要素かなど表示形式を指定
height・・・要素の高さを指定する
■リンク付け関係
１．HTMLタグと疑似クラス
<a> ・・・リンクを設定する
a:link ・・・未訪問のリンク
a:hover・・・要素をクリックしている時
a:active・・・要素をクリックしている時
a:visited・・・既に訪問済みのリンク
a:focus・・・要素にフォーカスしている時
２．リンク色を変更
list-style-image・・・リスト記号を画像にする
background-image・・・背景画像を指定する
background-repeat・・・背景画像の繰り返し方法を指定する
background-position・・・背景画像の開始位置を指定する
３．画像系CSSタグ
box-sizing・・・ボックスの横幅と高さに枠線とパディングを含むかを設定
text-decoration・・・背景画像を指定する
４．その他
:first-child・・・要素内で最初の要素
:last-child・・・要素内で最後の要素
:nth-child・・・要素内で最初からn番目の要素
:nth-last-child・・・要素内で後ろからn番目の要素
■ページ作成、作りこみ用タグ
１．CSSタグ
vertical-align・・・テキストの縦方向の位置揃えを指定
opacity・・・要素の透明度を指定する。
２．ボックス、テキスト関係
border-radius・・・ボックスを丸くする
box-shadow・・・ボックスの影を追加
text-shadow・・・テキストに影を追加
linear-gradient()・・・background-imegeタグなどの値に記述するとグラデーションを表現
３．位置、透明度
position・・・ボックスの配置方法を指定
top・・・上からの距離を指定
bottom・・・下からの距離を指定
left・・・左からの距離を指定
right・・・右からの距離を指定
z-index・・・ボックスの重なり順を指定
rgba()・・・背景色の他に透明度を指定
white-space・・・改行、スペース、タブ等の表示を指定
■フォーム用タグ
<form> ・・・フォームを作成
<input> ・・・フォーム部品を作成
<select> ・・・セレクトボックスを作成
<option> ・・・セレクトボックスの選択しを示す
<textarea> ・・・テキストエリアを作成
<label> ・・・ラベルを示し、フォームの部品と関連付ける
■その他
<!– コメント表示部分 –>・・・HTMLのコメントアウトの仕方
id・・・ユニークなタグ付けをする。CSS中には♯を用いて使用。同じものを使用してはいけない。
例）HTML中で <h1 id=”pageContent” と使用し、CSS内で #pageContent｛（※CSS記述※）｝とする。
class・・・汎用的なタグ付けを行う。CSS中には.を用いて使用。同じものを使用することが可能。
例）HTML中で <h1 id=”pageContent” と使用し、CSS内で .pageContent｛（※CSS記述※）｝とする。
