字符實體
- 在 html 中對空格/回車/tab 不敏感，會把多個空格/回車/tab 當作一個空格來處理
- 什么是字符實體？
在HTML 中有的字符是被 Html 保留的，有的 html 字符在 html 中是有特殊含義的，是不能在瀏覽器中直接顯示出來的，那么這些東西要想顯示出來必須通過字符實體 - 空格
一個 就是一個空格，有多少個 就有多少個空格 -
< <小于符號 < (less than) -
> >大于符號 > (greater than) -
? ©版權符號
體驗 CSS
- 有一個標題（H1）還有一些段落（p）標題是居中的，段落也是居中的，所以我們可以設置 H 標簽和 P 標簽對的 align 屬性等于 center 來實現
- 標題和段落都有顏色，都有字體，都有大小，所以需要給文字包裹一個 font 標簽，然后通過 font 標簽來設置顏色和字體以及大小
- 通過標簽來修改樣式的缺點
- 需要記憶哪些標簽有那些屬性，如果該標簽沒有這個屬性，那么設置了也沒有效果
- 當需求變更時我們需要修改大量的代碼才能滿足現有需求
- HTML 只有一個作用就是用來添加語義
- 所以在企業開發中修改樣式都是交給 CSS 來做
- 通過 CSS 來修改樣式有什么好處？
- 不用記憶哪些屬性屬于哪個標簽
- 當需求變更時我們不需要修改大量的代碼就可以滿足需求
- 在前端開發中 CSS 只有一個作用，就是用來修改樣式
<head>
<style type="text/css">
h1{
text-align:center;
color:red;
font-family:"微軟雅黑";
}
</style>
</head>
CSS 的格式
格式：
<style type="text/css">
標簽名稱｛
屬性名稱:屬性對應的值；
........
｝
</style>
注意點：
- style 標簽必須寫在 head 標簽的開始標簽和結束標簽之間（也就是必須和 title 標簽是兄弟關系）
- style 標簽中的 type 屬性其實可以不用寫，默認就是 type="text/css"
- 設置樣式時必須按照固定格式來設置 key:value;其中 : 和 ; 不能省略
- CSS 怎么學
- CSS 的學習一共分為兩大部分，一個是 CSS 的屬性，另一個是 CSS 選擇器，也就是說這兩部分學完 CSS 就沒有別的東西了
文字屬性
規定文字樣式的屬性
格式：font-style:italic;
取值：
nomal: 正常的，默認的就是正常的
italic: 傾斜的
快捷鍵：
fsi font-style:italic;
fsn font-style:nomal;
規定文字粗細的屬性
格式：font-weight:bold;
單詞取值：
bold 加粗
bolder 比加粗還粗
lighter 細線，默認就是細線
數字取值：100-900之間整百的數字
快捷鍵：
fw font-weight:;
fwb font-weight:bold;
fwbr font-weight:bolder;
規定文字大小的屬性
格式：font-size:30px
單位： px （像素 pixel）
注意點
通過 font-size 設置大小一定要帶單位也就是一定要寫 px
快捷鍵：
fz font-size:;
fz30 font-size:30px;
規定文字字體的屬性
格式：font-family:"楷體"
注意點
- 如果取值是中文，需要用雙引號或者單引號括起來
- 設置的字體必須是用戶電腦里已經安裝的字體
快捷鍵：
ff font-family:;
<style type="text/css">
p{
font-style:italic;
font-weight:bold;
font-size:10px;
font-family:"楷體"
}
</style>
字體屬性補充
如果設置的字體不存在，那么系統會使用默認的字體來顯示，默認宋體
如果設置的字體不存在，而我們又不想用默認的字體來顯示怎么辦？可以給字體設置備選方案
格式：font-family:"字體1","備選方案1", ...;如果想給中文和英文分別單獨設置字體，怎么辦？
但凡是中文字體，里面都包含了引文
但凡是英文字體，里面都沒有包含中文
也就是說中文字體可以處理英文，而英文字體不能處理中文
注意點：
如果想給界面中的英文單詞設置字體，那么英文的字體必須寫在中文的前面補充：在企業開發中最常見的字體有以下幾個
中文：宋體/黑體/微軟雅黑
英文：Times New Roman /Arial
還需要知道一點就是，并不是名稱是英文就一定是英文字體，因為中文字體其實都有自己的英文名稱，所以是不是中文字體主要看能不能處理中文
宋體: SimSun
黑體: SimHei
微軟雅黑：Microsoft YaHei
文字屬性的縮寫
縮寫格式
font:style weight size family;
例如
font:italic bold 10px "楷體"
注意點
- 在這種縮寫格式中有的屬性可以省略，style weight可以省略
- 在這種縮寫格式中 style 和 weight 的位置可以交換
- 在這種縮寫格式中有的屬性不能省略，size family 不能省略
- size 和 family 的位置是不能隨便亂放的，size 一定要寫在 family 的前面，而且 size 和 family 必須寫在所有屬性的最后
文本屬性
-
文本裝飾的屬性
格式：text-decoration:underline;
取值：
underline 下劃線
line-through 刪除線
overline 上劃線
none 什么都沒有，最常用的用途就是去掉 a 標簽的下劃線
快捷鍵：
td text-decoration:none;
tdu text-decoration:underline;
tdl text-decoration:line-through;
tdo text-decoration:overline;
- 文本水平對齊屬性
格式：text-align:right;
取值：
left 左
right 右
center 中
快捷鍵
ta text-align:;
tar text-align:right;
tal text-align:left;
tac text-align:center;
- 文本縮進的屬性
格式：text-indent:2em;
取值：
2em,其中 em 是單位，一個 em 代表縮進一個文字的寬度
快捷鍵：
ti text-indent:;
ti2e text-indent:2em;
顏色屬性
- 在 CSS 中如何通過 color 屬性來修改文字顏色
格式：color:值;
取值：
英文單詞，一般情況下常見的顏色都有對應的引文單詞，但是英文單詞能夠表達的顏色是有限制的，也就是說不是所有的顏色都能夠通過引文單詞來表達
rgb,rgb其實就是三原色，其中 r （red）,g(green),b(blue),
格式：
rgb(0,0,0)
那么這個格式中的第一個數字就是用來設置三原色的光源元件紅色顯示的亮度，第二個數字就是用來設置三原色的光源元件綠色顯示的亮度，第三個數字就是用來設置光源元件藍色顯示的亮度，這其中每一個數字它的取值是 0-255 之間，0代表不發光，255代表發光，值越大就越亮紅色: rgb(255,0,0);
綠色: rgb(0,255,0);
藍色: rgb(0,0,255);
黑色: rgb(0,0,0);
白色: rgb(255,255,255);在前端開發中其實并不常用黑色，只要讓紅綠藍的值一樣就是灰色，而且如果這三個值越小那么就越偏黑色，越大就越偏白色
例如：color:rgb(200,200,200);rgba,rgba 中的 rgb 和前面講解的一樣只不過多了一個 a，那么這個 a 呢代表的透明度，取值 0-1,值越小越透明
例如：color:rgba(255,0,0,0.2);十六進制，在前端開發中通過十六進制來表示顏色，其實本質就是 rgb，十六進制中是通過每兩位表示一個顏色
例如：#ffee00 ff表示r ee表示g 00表示b什么是十六進制，十六進制和十進制一樣都是一種計數方式，在十進制中取值范圍0-9逢十進一，在十六進制中取值范圍0-F，逢十六進一
十六進制和十進制轉換的公式，
用十六進制第一位*16 + 十六進制第二位 = 十進制十六進制的縮寫，在 CSS 中只要十六進制的顏色每兩位的值都是一樣的，那么可以簡寫為一位
例如：#ffee00 = #fe0
注意點如果當前顏色對應的兩位數字不一樣，那么不能簡寫，#123456
如果兩位相同的數字不是屬于同一個顏色那么不能簡寫，#122334
- 關于為什么 rgb/rgba 每一個通道取值是0-255，因為我們的電腦顯示器分24位和32位，rgb 每一個通道占8個二進制位，8個二進制位范圍是0-11111111(二進制 2的8次方-1=255),32位對應的 rgba。
- 關于為什么用十六進制表示，十六進制范圍是0-F 轉化成二進制范圍就是0-1111，兩位十六進制的范圍就是0-FF 轉化成二進制就是0-11111111，一位十六進制最大可以代表四位二進制，對應0-255 取值
