小白學習前端的第二天之css基本語法

2021-10-25 08:39:47 字數 1264 閱讀 5421

1.css**寫在哪兒

內聯樣式表:將css**寫在標籤的style屬性中

內部樣式表:將css**寫在style標籤中

外部樣式表:將css**寫在外部的css檔案中,然後在html中通過link標籤來匯入

2.css語法

1)語法

選擇器2)說明

選擇器 - 選中當前需要新增樣式的標籤(在內聯樣式表中'選擇器{}'需要省略)

屬性 - 屬性名有哪些是固定的(不同的樣式有對應的固定屬性);

屬性值如果表示的是數值大小必須加單位:px

多個屬性之間必須用分號隔開

3.選擇器

1)id選擇器 - 在id屬性值前加#作為乙個選擇器,選中id屬性是指定值的標籤

例如:#user - 選中id屬性值是user的標籤(id屬性是唯一的)

2)類選擇器 - 在class屬性前加.作為乙個選擇器,選中class屬性是指定值

例如:.c1 - 選中class屬性是c1的所有標籤

3)元素選擇器 - 直接將標籤名作為選擇器,選中所有指定的標籤

例如:p

- 選中當前頁面中所有的p標籤

4)群組選擇器 - 將多個選擇器用逗號隔開作為乙個選擇器,選中每個選擇器選中的標籤

#p1,.c1{} - 選中id是p1的標籤和class是c1的標籤

p,a,

.c2- 選中所有的p標籤,所有的a標籤和所有class是c2的標籤

5)後代選擇器 - 將多個選擇器用空格隔開

例如:div p

- 選中直接或者間接包含在div標籤中的p標籤

.c1 p

- 選中直接或者間接包含在class是c1的標籤中的p標籤

div .c1 p

- 選中包含在div中的class是c1中的p標籤

6)子代選擇器 - 將多個選擇器隔開

例如:div>p

- 選中直接包含在div標籤中的p標籤--

>

"color: red;">我是段落1

"box1">我是dic1

"" class="c1 ">我是超連結1

"c1">我是段落2

"text" name="" id="" value="" />

"">

"">我是超連結2

我是段落3

"c1">我是span1

我是段落4

前端學習第二天

1.what is web 語義化 假設我們世界中有乙隻神奇小爬蟲,這個小爬蟲非常神奇,我們看不到它,同時它爬行的速度非常快,它可以在世界上所有的計算機之間爬來爬去,爬過的地方都會留下一條線,這條線就是網線。當小爬蟲爬過了大部分的計算機之後,這些計算機就組成了網路,而爬蟲的速度可以理解成網速。小爬蟲...

前端學習第二天

一 html文字標籤 hn,span,p html中標題 heading 分為6級,分別是 h1 h2 h3 h4 h5 h6 h1 h6標籤具有和p標籤一樣的特徵 佔滿整行,上下換行 普通文字標籤span 在html用於顯示文字的基本標籤對是。雖然不編寫任何標籤,將文字直接寫於標籤對內也能正常顯示...

前端學習第二天

層疊的概念 使用樣式的三種方式 1.引用外部樣式檔案 2.寫在head裡面style標籤內 3.寫在元素開始標籤內 用style屬性 同一 外部檔案,style標籤,內聯 層疊的優先順序 1.id的優先順序最高 2.類其次 3.tag標籤類再其次 4.瀏覽器預設的最低的。不同瀏覽器預設顯示的內容樣式...