📖

CSSの基本の書き方

2022/05/24に公開

CSSの基本の書き方

common.css
@charset "utf-8";

→最初に文字コードを入力する

common.css
@charset "utf-8";

*,
::before,
::after{
    padding: 0;
    margin: 0;
}

→各要素にはデフォルトで余白が設定されているため、余白を解除する。
全ての要素「*(全称セレクタ)」と類似要素=「::before」「::after」に対して余白を解除する指定を入力をする

common.css
body{
    font-family: sans-serif;
}

→テキストのフォントを指定する

common.css
body{
    font-family: sans-serif;
    font-size: 16px;
    color: #000000;
    line-height: 1;
}

→文字サイズ、色、行間を指定する

common.css
body{
    font-family: sans-serif;
    font-size: 16px;
    color: #000000;
    line-height: 1;
    background-color: #ffffff;
}

→背景色を指定する

common.css
img{
    max-width: 100%;
}

→img要素の最大幅を指定する
大きな画像をそのまま配置すると親要素から飛び出してしまうことがあるため、img要素の最大幅が親要素の範囲内に収まるように指定しておく。指定には「max-width」プロパティを使用し、値は「100%」を指定

common.css
ul,
ol{
    list-style: none;
}

→リストの行頭アイコンを非表示にする

common.css
a{
    color: inherit;
    text-decoration: none;
}

→リンクも文字色と下線をなくす

Discussion