CSS word-break 単語の改行方法を指定
目次 01. word-break ・word-breakとは(単語の改行方法を操作する) 02. 値：normal ・normalで日本語の場合、単語の途中でも改行する ・normalで英字の場合、単語の途中でも改行し […]
カテゴリー：HTML / CSS
CSS pxとemとremの違い(長さの単位)
目次 01. px ・ディスプレイの1ピクセルを1とする(px) 02. em ・要素にあるfont-sizeの値を1とする(em) 03. px ・ルート要素のfont-sizeの値を1とする(rem) ディスプレイの […]
CSS transition 要素をアニメーションさせる
説明 transition サンプル １．ゆっくり>加速>減速(ease) ２．一定の速度で変化(linear) ３．ゆっくり>加速(ease-in) ４．高速 […]
CSS list-style-type リスト項目のデザインを指定
目次 01. list-style-typeとは ・list-style-typeとは 02. 使用例 ・黒い丸 (disc) ・白い丸 (circle) ・黒い四角 (square) ・10進数の数値 (decimal […]
HTML ul要素とli要素でリストを作成する
目次 サンプル ulとli ulとliでリストを表示 リストの行間をmarginで広げるサンプル olとliのサンプル(番号付きのリスト) ulとli ulは、li要素とセットで、箇条書きのリ […]
CSS 属性セレクタのサンプル(要素名[属性名=”値”])
CSSの属性セレクタのサンプルです。 目次 用語 セレクタとは 属性と属性値と要素の関係 属性セレクタ １．要素名[属性名] ２．要素名[属性名=”値”] (指定の属性の値がある) ３．要 […]
CSS ボックスモデルの構造
目次 01. ボックスモデルとは ・ボックスモデル ・Chromeでボックスモデルを確認する ボックスモデルとは すべての要素は、長方形のボックスと呼ばれる領域を持っています。 ボックスモデルと呼ばれます。 以下は、ボッ […]
CSS text-indent 文章にインデントを設定する
目次 01. text-indent ・text-indentとは 02. 使用例 ・インデントなし ・インデントを25pxで指定 ・インデントを-25pxで指定 ・継承で文章のインデント(字下げ)する text-ind […]