css

span

div

inline要素はできるだけ減少し、block要素はできるだけ増加します.
Inline要素は、レイアウト制御x文字(すなわち、幅、高さ制御x)を制御するために使用されるmax-width , max-heightnone:最大幅制限X(default)
Auto:ブラウザの幅の計算(Xは一般的ではありません)
単位:px、em、vw、...min-width , min-height0:最小幅制限なし(default)、負数x
Auto:ブラウザで幅を計算する(ZはXがあまり使いにくい)
単位:px、em、vw、...

たんい

px

%:親要素基準

em:要素のフォントサイズ(親要素による子要素の影響)

rem:ルート要素(html)のフォントサイズ

vw:ビューポート幅のパーセンテージ(100基準満杯)

vh:ビューポート縦幅のパーセンテージ

font-size : 16px (default)

ショートカットのプロパティ

上下^くらい
margin:上^左右^下(上中下)
margin:上^右^下^左(時計回り)
padding
要素のサイズが大きくなる

box-sizing

content-box:要素の内容からサイズを計算する(default)border-box:内容+塗りつぶし+枠線サイズで計算
縦横に使いたい場合は、使用可能border-box

.item {
    width: 100px;
    height: 100px;
    background-color: orange;
}


.item:first-child{
    border : 4px solid red;
    padding: 20px;
    box-sizing: border-box;
}

content-box沙龍市
border-box使用時

display

エレメントのスクリーン出力(表示)プロパティ
深い見出し:要素ごとに指定された値block:枠(レイアウト)要素inline:文字要素inline-block:文字+枠要素flex:Flexbox(一次元レイアウト):一軸grid:グリッド(2 Dレイアウト)none:表示特性X、画面上に消える

display : none;

開発者ツールでは、要素は存在しますが、表示されません.

line-height

1行の高さ1行の高さ:類似行間
normal:ブラウザデフォルト1숫자:要素フォントサイズの倍数を指定する(推奨)단위:px、em、rem等単位指定
付与時の構造

background

backgroud-attachment

fixed:スクロール時、背景画像がビューポートに固定されている属性scroll:デフォルト

background-size

cover:幅を広くするのに適しています.contain:より短い幅に調整する.

background-position

center:中央位置top right右上隅

へんかん

transform

skew

perspective