css：
一、選擇器
樣式規則：
屬性名1：屬性值1;
屬性名2：屬性值2;
屬性名3：屬性值3;
選擇器:是用來選擇標籤的，選出來以後給標籤加樣式
說明css 是由兩個主要的部分構成：選擇器和一條或多條樣式規則
注意:樣式規則需要放到大括號裡面
css作用:
css 是層疊樣式表，它是用來美化網頁和控制頁面布局的
css語法格式:
定義 css 的語法格式是: 選擇器
二、css 的引入三種方式
css的三種引入方式
①行內式
②內嵌式（內部樣式）
③外鏈式
行內式定義:
直接在標籤的 style 屬性中新增 css 樣式
內嵌式定義:
在標籤內加入
外鏈式定義:
將css**寫在乙個單獨的.css檔案中，在標籤中使用標籤直接引入該檔案到頁面中
css引入方式選擇
行內式幾乎不用
內嵌式在學習css樣式的階段使用
外鏈式在公司開發的階段使用，可以對 css 樣式和 html 頁面分別進行開發
三、 css 選擇器
css 選擇器的種類
①標籤選擇器
②類選擇器
③層級選擇器(後代選擇器)
④id選擇器
⑤組選擇器
⑥偽類選擇器
（1）標籤選擇器
根據標籤來選擇標籤，以標籤開頭，此種選擇器影響範圍大，一般用來做一些通用設定
（2）類選擇器
根據類名來選擇標籤，以 . 開頭, 乙個類選擇器可應用於多個標籤上，乙個標籤上也可以使用多個類選擇器，多個類選擇器需要使用空格分割，應用靈活，可復用，是css中應用最多的一種選擇器
（3）層級選擇器(後代選擇器)
根據層級關係選擇後代標籤，以選擇器1 選擇器2開頭,主要應用在標籤巢狀的結構中，減少命名
注意點:
這個層級關係不一定是父子關係，也有可能是祖孫關係
只要有後代關係都適用於這個層級選擇器
（4）id選擇器
根據id選擇標籤，以#開頭, 元素的id名稱不能重複，所以id選擇器只能對應於頁面上乙個元素不能復用
注意點:
雖然給其它標籤設定id=「box」也可以設定樣式, 但是不推薦這樣做，
因為id是唯一的，以後js通過id只能獲取乙個唯一的標籤物件
（5）組選擇器
根據選擇器的組合選擇不同的標籤，以 , 分割開, 如果有公共的樣式設定，可以使用組選擇器
（6）偽類選擇器
用於向選擇器新增特殊的效果, 以 : 分割開, 當使用者和**互動的時候改變顯示效果可以使用偽類選擇器
css選擇器作用:
css 選擇器就是用來選擇標籤設定樣式的
常用的 css 選擇器有六種，分別是:
1.標籤選擇器
2.類選擇器
3.層級選擇器(後代選擇器)
4.id選擇器
5.組選擇器
6.偽類選擇器
四、css屬性
樣式屬性種類:
①布局常用樣式屬性
②文字常用樣式屬性
（1）布局常用樣式屬性
width 設定元素(標籤)的寬度，如：width:100px;
height 設定元素(標籤)的高度，如：height:200px;
background 設定元素背景色或者背景
如：background:gold; 設定元素的背景色, background: url(images/logo.png); 設定元素的背景
border 設定元素四周的邊框
如：border:1px solid black; 設定元素四周邊框是1畫素寬的黑色實線
以上也可以拆分成四個邊的寫法，分別設定四個邊的：
border-top 設定頂邊邊框，如：border-top:10px solid red;
border-left 設定左邊邊框，如：border-left:10px solid blue;
border-right 設定右邊邊框，如：border-right:10px solid green;
border-bottom 設定底邊邊框，如：border-bottom:10px solid pink;
（2）文字常用樣式屬性
color 設定文字的顏色，如： color:red;
font-size 設定文字的大小，如：font-size:12px;
font-family 設定文字的字型，如：font-family:『微軟雅黑』;為了避免中文字不相容，一般寫成：font-family:『microsoft yahei』;
font-weight 設定文字是否加粗，如：font-weight:bold; 設定加粗 font-weight:normal 設定不加粗
line-height 設定文字的行高，如：line-height:24px; 表示文字高度加上文字上下的間距是24px，也就是每一行占有的高度是24px
text-decoration 設定文字的下劃線，如：text-decoration:none; 將文字下劃線去掉
text-align 設定文字水平對齊方式，如text-align:center 設定文字水平居中
text-indent 設定文字首行縮排，如：text-indent:24px; 設定文字首行縮排24px
設定不同的樣式屬性會呈現不同網頁的顯示效果
樣式屬性的表現形式是: 屬性名:屬性值
前端基礎高階2
取值 正負均可 空間位移title box box hover style head div body html 預設情況下，為什麼無法觀察到z軸位移效果？屬性 新增給父級 作用 透視效果title body box box hover style head div body html 實現方法 動...
前端基礎 2 CSS
選擇器 注釋用 這裡是注釋 在html標籤中用style屬性值設定 key value1，value2.key value1，value2.我是內容 在html 的head標籤中用style標籤來定義css樣式 要用到選擇器,這裡先用標籤選擇器 把css樣式寫成單獨的css檔案 要用到選擇器 再在h...
Web前端基礎學習 2
盒子模型 在頁面中，我們將所有的元素全部看做是乙個盒子，頁面布局就是將大大小小不同的盒子堆砌在一起，而乙個盒子由以下幾部分組成 padding 內邊距，內容到邊框的距離 margin 外邊距，其他盒子到當前盒子的邊框的距離 border 邊框 所以乙個元素在頁面中實際所佔的空間是 內容 paddin...