首先css規范使用

體驗CSS語法規范 要寫在head最下方，雖然不影響使用，但是寫在這里最方便觀看 Css語法格式 選擇器 { 屬性: 值; 屬性: 值; } 選擇器之間和屬性和值之間要保留空格 選擇器共有四種 類選擇器 .red { width: 100px; height: 100px; background-color: red;} .green { width: 100px; height: 100px; background-color: green;}

標簽選擇器
h3 {
color: blue;
font-size: 48px;}
li {
color: red;
font-size: 24px;}

Id選擇器
#one {
color: blueviolet;
}

通配符選擇器

• {
  margin: 0;
  padding: 0;
  }
  基礎選擇器總結
  基礎選擇器 作用 特點 使用頻率
  標簽選擇器 選出相同標簽 不能差異化選擇 較多
  類選擇器(.) 按需選擇標簽 根據需求選擇 非常多
  id 選擇器(#) 選中唯一標簽 針對唯一標簽 通常與 JavaScript 聯用
  通配符選擇器(*) 選中所有標簽 選擇的太多，有部分不需要 特殊情況使用

font-family 設置字體系列
.hh {
font-family: ‘Segoe UI’, Tahoma, Geneva, Verdana, sans-serif;
}

Font-size字號大小
li {
font-size: 22px;
}
Font-weight字號粗細
em {
font-weight: 700;
}
Font-style字號樣式
em {
font-style: normal;
}

字體屬性總結

屬性 含義 注意事項
font-size 字號 單位通常是 px（像素），字號一定要有單位
font-family 字體 工作中按照團隊約定即可
font-weight 字重 700 加粗 / 400 普通，數字字重不帶單位
font-style 字體樣式 italic 斜體 / normal 正常，把 em 改成不傾斜
font 連寫 font-style font-weight font-size/line-height font-family
文本顏色 color
文本對齊 text-align
分為
1.left：左對齊（默認）；
2.right：右對齊；
3.center：居中。
文本裝飾 text-decoration

屬性值 描述
none 默認，沒有裝飾線，最常用
underline 下劃線，常用
line-through 刪除線，不常用
overline 上劃線，幾乎不用

文本縮進 text-indent
縮進單位為em字符，無論字號多大，就縮進兩個字符

行間距 line-height
單位也是em，
后期也會當做上下居中使用
CSS 文本屬性總結
屬性 含義 注意事項
color 顏色 #fff / rgba(r, g, b, 透明度)
text-align 對齊 left / right / center
text-indent 首行縮進 text-indent: 2em;
text-decoration 文本修飾 text-decoration: underline; / text-decoration: none;
line-height 行高 行高等于盒子高度會垂直居中

Css又分為內部樣式表
行內樣式表
外部樣式表
有需要pink老師文檔資料請留言

總結

以上是生活随笔為你收集整理的萌新入门第三天，css第一天，小白新手入门必看的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。