今天是劉小愛自學Java的第78天。
感謝你的觀看，謝謝你。
話不多說，繼續前端之CSS的學習：
其中在頭條搜尋中也有很多關于CSS的幹貨教程，專業又詳細，點選下方卡片搜尋“CSS”了解更多
一、CSS概述
CSS，全稱是Cascading Style Sheet，翻譯過來就是層疊樣式表。
它有一個非常厲害的功能，就是美化網頁。
本質上HTML也可以美化網頁，但是CSS更加地強大，可以實作很多HTML不能實作的功能。
CSS有一個核心标簽叫style，也就是樣式的意思，CSS本身也就是可以設定各種各樣的樣式。
用一個例子來說明：
①h1的美化
如果純用HTML，是沒法對标題進行顔色設定的。
但使用CSS，就可以對标題進行各種樣式的設定，上圖隻舉了顔色這個例子。
②字型的美化
字型是可以在HTML中設定屬性的，比如顔色(color)，比如大小(size)…
而CSS等于是将這些屬性抽取出去了，專門放在
這樣有什麼好處？
降低耦合度，分工更加地明确，CSS專門用來美化，HTML專門用于結構搭建，如果想設定格式，指定CSS就好了。
這個就有點類似于Java中方法的封裝，或者說經典三層架構。
Service層專門負責具體的業務邏輯，Dao層專門負責資料庫的查詢，Service想通路資料庫，調用Dao層就好了。
二、CSS的引入
CSS一共有三種引入方式。用例子說明：
①行内樣式
直接在标簽中添加style屬性，也能起到引入CSS的效果。
但是為了降低耦合度，一般在HTML主幹中隻搭建結構，設定樣式專門交給CSS來做。
②内部引入
也就是一開始的那個例子，sytle标簽是放在head标簽中的。
除了這兩種，還有一種外部引入方式：
③外部引入(一)
可以自定義一個CSS檔案，在裡面寫自定義的樣式。
然後在HTML檔案中使用style标簽引入該CSS檔案即可，其中引入格式如下：
@import+CSS檔案路徑。
和Java中的導包很類似，檔案路徑中的“..”表示回到上一層。
④外部引入(二)
除了使用style外，還可以使用link标簽外部引入：
- type屬性：指定文本的類型。
- rel屬性：relation的簡寫，指定目前的HTML與CSS檔案之間的關系。
- href屬性：CSS檔案位址，上面兩個屬性都可以省略，但是href屬性不能省略。
關于這三種引入方式的優先級：
行内引入是最優先的。
内部引入和外部引入，就看哪個離HTML檔案主體近(就近原則)
三、基本選擇器
選擇器的作用在于：可以幫我們從頁面上獲得對應的标簽。
其中有最基本的三種選擇器：
①id選擇器
格式為：#+id名{}
關于id我做了個測試，發現不能用純數字，老實說我還挺奇怪的，一般id不都是純數字麼。
就當是CSS的命名規則好了，不能是純數字，否則沒有作用。
其中id選擇器是唯一的，也就是一個id在一個HTML檔案中隻能有一個。
②類選擇器
格式為：.+類名{}
類是可以有多個的，比如同樣是font标簽，相同的id隻能有一個，但是相同的類可以有多個。
③标簽選擇器
格式為：标簽名{}
HTML中是有很多标簽的，可以直接使用過标簽作為選擇器，上圖例子中是font标簽。
關于這三種選擇器的優先級：
id選擇器最大，類選擇器次之，标簽選擇器最小。
這其實也很好了解：
id選擇器最精準，優先級越高(例子中①哪怕也是myClass類，标簽也是font),但樣式還是按照id選擇器設定的來。
四、拓展選擇器
除了三種基本選擇器外，還有好幾種選擇器：
①層級選擇器
格式為：div+空格+标簽名{}
标簽與标簽之間是用空格隔開的。
在HTML中有一個div标簽，這個标簽和CSS結合起來很有用。
比如上述例子中，同樣是h1标簽，但是隻渲染div标簽中的h1标簽。
②并集選擇器
格式為：div+逗号+标簽名{}
标簽與标簽之間是用逗号隔開的，也就是相當于将标簽選擇器并起來了，同時修改多個标簽的樣式。
③屬性選擇器
格式為：标簽名[屬性名="對應的值"]{}
font标簽中有很多屬性，CSS可以指定其中對應的屬性。
比如size=“3”的才修改樣式，其中哪怕font預設字型size為3，但是沒有寫出size屬性，也不會修改其樣式。
④僞類選擇器
格式為：标簽名+冒号+對應的狀态
- link：也就是滑鼠未點選時為黑色。
- hover：懸浮的意思，也就是滑鼠放在上面時為紫色。
- active：行為的意思，也就是滑鼠點選時的顔色為紅色。
- visited：通路過的意思，也就是滑鼠點選後的顔色為藍色。
是以為什麼叫僞類？
并不是修改的某個具體的類修改，而是對标簽對應的狀态進行修改。
其中關于CSS選擇器真的太多太多了，可以查詢W3C官方文檔，如下圖：
這還是我截圖的一小部分，其它的截不下了，一共有幾十種。
想要完全把它學習下來真心需要花一定的時間，但我畢竟還是以學Java背景為主，對前端隻做一個基本的了解。
以後有機會再做做總結什麼的，估計也沒什麼機會了……
最後
謝謝你的觀看。
如果可以的話，麻煩幫忙點個贊，謝謝你。