HTML・CSS入門
HTMLの基本事項
CSSの基本事項
- CSSの基本書式
- CSSの適用方法 3種類
- CSSのコメント
- 複数のCSSファイル @import
- ベンダープレフィックス
- 長さ・大きさの指定方法
- 色の指定方法
- 角度の指定方法
- 円マークがバックスラッシュになる問題
- 円記号とバックシュラッシュを同時に表示する
- CSS変数(カスタムプロパティ)
- 最優先 !important
CSS セレクタ
テキスト
- フォント font-family
- フォントサイズ font-size
- 文字を太字にする font-weight
- italic と oblique の違い
- テキストを半透明にする
- インデント text-indent
- タブ幅 tab-size
- 行の高さ line-height
- 文字の間隔 letter-spacing
- 下線や字消し線を引く text-decoration
- 下線の「色」や「太さ」 underline
- 前後に文字を追加 content
- 引用符を指定する quotes
- 見出し等に連番を振る
- テキストの「縁取り」text-shadow
- preタグを枠内に収める
- span要素にwidth(横幅)を指定
- 改行やスペース(空白)を入れる方法
- 空白や改行の表示方法 white-space
リンク
リスト
テーブル
- セルを結合する(縦・横)
- ヘッダ・本体・フッタに分ける
- 枠線(border)の隙間をなくす
- 枠線(border)の「太さ」
- 枠線(border)を消す
- 枠線(border)を下だけ引く
- 枠線が表示されない場合
- 列幅の表示方法(固定・自動)
- 列幅の割合を指定
- td要素間の隙間を設定 border-spacing
- テーブルを中央に配置
- セル内容を上下方向に中央揃え
- caption の位置を指定する
- 奇数行と偶数行で色を変える
色・画像・背景
- 線形グラデーション liner-gradient()
- 背景色 background-color
- 背景画像 background-image
- 繰り返し background-repeat
- 位置指定 background-position
- 背景画像を固定・移動する
- 複数の背景画像を指定する
- 画像を半透明にする
- 画像が表示されない原因
ボックス
- ボックスモデルについて
- マージン margin
- パディング padding
- margin、padding の上下左右の順番
- ボックスの配置方法 position
- 枠線(border)の太さを指定
- border の長さを可変にする
- 要素を右寄せにする
- 正円を描く border-radius
- 上だけ(下だけ)を角丸にする
レイアウト全般
- 要素の表示形式 display
- block, inline, inline-blockの違い
- display:noneとvisibility:hidden 違い
- 一行の中でテキストを左寄せと右寄せに
- hr(水平線)の「色」と「太さ」
- hr(水平線)の「長さ」
- hr (水平線)を点線にする
- hr(水平線)をグラデーションにする
- 線の間に文字を入れる
トランジション
フォーム
- フォーム部品一覧
- チェックボックスのサイズ変更
- ラジオボタンに初期値を設定する
- ラジオボタンをラベルで囲む
- ラジオボタンを複数グループに分ける
- textareaのサイズを固定する
- textareaの赤い波線を消す
- リセットボタン
- フォーカス時に枠線を表示
- プレースホルダー(placeholder)の色を変更
- プレースホルダー(placeholder)で改行
- プレースホルダー(placeholder)の文字位置