CSS 擬似クラスと疑似要素の違い
目次 ・擬似クラスと疑似要素の違いのまとめ ・擬似クラスとは ・疑似要素とは 擬似クラスと疑似要素の違いのまとめ 意味 記法 例 擬似クラス 要素の状態や条件を表す :（コロン1つ） :hover, :nth-child […]
カテゴリー：HTML / CSS
CSS セレクタの一覧とよく使うセレクタ
目次 ・CSSセレクタの一覧 ・よく使うセレクタ CSSセレクタの一覧 セレクタは、CSSを適用する場所を指定します。 セレクタ名 説明 書き方と 対象(例) 要素セレクタ (タグセレクタ) タグ名で指定。全ての同じ要素 […]
Sassとは (CSSとの違い)
目次 ・SassとCSSの違いのまとめ ・SCSSとCSSの変数の例 ・SCSSのネストの例 ・SCSSのミックスイン (Mixins)の例 ・SCSSの継承 (Extend)の例 ・SCSSの演算の例 SassとCSS […]
htmlのテーブルの列で数値をインクリメントして設定する
目次 01. 目的 02. コード 目的 htmlのテーブルの列で数値をインクリメントして設定する 上記図では、Noの列の数値は、JavaScriptでインクリメントしてセットしています。 コード <style&g […]
htmlのテーブルでスマホでみたとき画面右にでないようにする
目次 01. 目的 02. コード 目的 htmlのテーブルでスマホのように画面の横幅が狭くてテーブルが右にはみでるときに、スクロールが表示されるようにする 上記図のようにテーブルの下にスクロールバーが表示されます。 コ […]
CSSとjs idに数値を指定する場合(エスケープ)
目次 ・目的 ・例１：数値のidをcssから指定する ・例２：数値のidをjs(jQUery)から指定する 目的 HTML要素に「数値のID（例：<div id=”123″>）」がある場合、CSSではそのまま […]
CSS font-size 文字の大きさを変更する
目次 ・font-sizeとは ・文字の大きさを変更する(px) ・文字の大きさを変更する(em) ・文字の大きさを変更する(rem) ・継承で文字の大きさを指定する font-sizeとは font-sizeは、文字の […]
CSSで変数を使うサンプル
目次 ・CSSで変数を使うサンプル ・数値の計算も可能 CSSで変数を使うサンプル 変数に値を設定 –変数名: 値 変数の設定は先頭にハイフンを2つ付けます。 変数を使用 var(–変数名) 変数を使用する場合は、v […]