1 選擇器
通用選擇器：匹配所有元素
*{
}
標(biāo)簽選擇器
一般選擇
header{
}
遞推選擇 選擇header下的nav
header nav{
}
類選擇器
.a{
}
<div class="a"> </div>
ID選擇器 唯一
#a{
}
<div id="a"> </div>
2 CSS屬性樣式
*{ margin: 0; padding: 0;}
邊框厚度為0 內(nèi)部填充為0
header {
display: flex; justify-content: space-between; align-items: center;
}
- 顯示方式：彈性盒子布局福压；
- 主軸（水平軸）元素對齊方式：左邊第一元素緊貼左邊蒋伦，右邊第一元素緊貼右邊姓建，中間間隔均勻蔫磨；
- 主軸水平：垂直居中 主軸垂直：水平居中 （示例主軸水平）由
flex-direction: column決定主軸方向
自定義屬性
data-xxx
彈性盒子的空間比例
flex:1 /*占據(jù)剩余空間*/
flex:1;
flex:2;/*按1：2比例占據(jù)剩余空間*/
3 字體設(shè)置
一種更方便的字體設(shè)置
html { font-size: 12px;} /*后續(xù)推薦使用rem單位*/
a { font-size: 1.5rem} /*一個(gè)rem表示一個(gè)12px*/
