【CSS】基本タグまとめ【情報まとめ】

プログラミング

2019/10/29 更新

・flexbox 追加

Webデザインでよく使うかもしれないタグのまとめ

コメントの書き方 /* */

/* CSSのコメントはこう書く */

文字の色 color

color:#ff0000;

文字サイズ font-size

font-size:10px;

フォントの種類 font-family

font-family:”Avenir Next”;

背景色 background-color

background-color:#dddddd;

横幅 width

width:500px;

高さ heigth

heigth:80px;

リストのマークをなくす list-style

list-style:none;

指定した要素を横並びにする float

float:left;

指定した要素を横並びにする flexbox

HTMLの親要素に「display: flex;」を指定する(ンライン要素に使う場合は「display: inline-flex;」)

要素に余白を入れる(borderの内側) padding

padding:20px;

padding:top+bottom right+left;

padding:top right bottom left;

padding-(top right bottom left):–px;

要素に余白を入れる(borderの外側) margin

margin:20px;

margin:top+bottom right+left;

margin:top right bottom left;

margin-(top right bottom left):–px;

枠線をつける border

border:5px solid red;

border-bottom:1px solid #333;

CSS例

.class名{          *class名にはドット(.)をつける

}

h1{            *タグ(h1やli)の場合は不要

}

.class名 タグ名{       *特定classのタグを指定

}

タグ名, タグ名{       *複数のタグに同じCSSを適用

}

コメント

タイトルとURLをコピーしました