css (cascading style sheets 層疊樣式表)
層疊：多個樣式可以作用在同乙個html的元素上，同時生效
1. 功能強大
2. 將內容展示和樣式控制分離
- 減低耦合度。解耦
- 讓分工協作更容易
- 提開發效率
內聯樣式
內部樣式
外部樣式
定義css資源檔案
在head標籤內，定義link標籤，引入外部的資源檔案
div>
head
>
1方式不常用，後期常用2,3
第三種格式可以寫為：
>
@import "css/a.css"
style
>
選擇器選擇器：篩選具有相似特徵的元素
分類
(1)基礎選擇器
id選擇器：選擇具體的id屬性值的元素，建議在乙個html頁面中id值唯一（在標籤內設定id的鍵值對）
語法：id屬性值{}
元素選擇器：選擇具有相同標籤名稱的元素
語法：標籤名稱{}
注意：id選擇器的優先順序要高於元素選擇器
類選擇器：選擇具有相同的calss屬性值的元素（在標籤內設定class的鍵值對）
語法：.class屬性值{}
注意：類選擇器的優先順序要高於元素選擇器
（2）擴充套件選擇器
選擇所有元素：
語法：*{}
並集選擇器
選擇器1，選擇器2{}
子選擇器：刪選選擇器1元素下的選擇器2元素
語法：選擇器1 選擇器2{}
父選擇器：篩選選擇器2的父選擇器1
語法：選擇器1>選擇器2{}
屬性選擇器：選擇元素名稱，屬性名=屬性值的元素
語法：元素名稱[屬性名=「屬性值」]{}
偽類選擇器：選擇一些元素具有的狀態
語法：元素:狀態{}
如：狀態：
link：初始化的狀態
visited：被訪問過的狀態
active：正在訪問的狀態
hover：滑鼠懸浮的狀態
字型、文字
font-size：字型大小
color：文字顏色
text-align：對齊方式
line-height：行高
背景 background
邊框 border：設定邊框，符合屬性
尺寸 width：寬度
height：高度
盒子模型
margin：外邊距
padding：內邊距
預設情況下，內邊距會影響整個赫茲的大小
box-sizing:border-box; 設定赫茲的屬性會最終就是赫茲的大小
float：浮動
left
right
lang
="en"
>
>
charset
="utf-8"
>
>
csstitle
>
>
*.parent
.child
style
>
head
>
>
class
="parent"
>
class
="child"
>
測試div
>
div>
body
>
html
>
}
.child
```
前端CSS基礎
頁面布局要學習三大核心,盒子模型,浮動 和 定位。學習好盒子模型能非常好的幫助我們布局頁面 網頁布局過程 先準備好相關的網頁元素，網頁元素基本都是盒子 box 利用 css 設定好盒子樣式，然後擺放到相應位置。往盒子裡面裝內容 網頁布局的核心本質 就是利用 css 擺盒子 所謂盒子模型 就是把htm...
前端CSS基礎
目錄二 scc 書寫位置 引入方式實戰 三 css注釋管理 四 基本選擇器 重要 五 組合選擇器 重點 六 屬性選擇器 七 分組與巢狀 八 偽類選擇器 一 css 1.什麼是css？css cascading style sheet，層疊樣式表 定義如何顯示html元素。當瀏覽器讀到乙個樣式表，它就...
前端基礎 css筆記
css的四種引入方式 1.行內式 顯示優先順序最高 hello 2.嵌入式3 鏈結式 4.匯入式注意 匯入式會在整個網頁裝載完後再裝載css檔案，因此這就導致了乙個問題，如果網頁比較大則會兒出現先顯示無樣式的頁面，閃爍一下之後，再出現網頁的樣式。這是匯入式固有的乙個缺陷。使用鏈結式時與匯入式不同的是...