css類選擇器和ID選擇器

2022-06-20 15:21:11 字數 1394 閱讀 2136

語法:

.類選器名稱

注意:

1、英文圓點開頭

2、其中類選器名稱可以任意起名(但不要起中文噢)

使用方法:

第一步:使用合適的標籤把要修飾的內容標記起來,如下:

膽小如鼠

第二步:使用class="類選擇器名稱"為標籤設定乙個類,如下:

膽小如鼠

第三步:設定類選器css樣式,如下:

.stress/*類前面要加入乙個英文圓點*/

我們也能實現讓div字型變成紅色的效果:

技術點的解釋:

1、使用id選擇器,必須給標籤新增上id屬性,為標籤設定id="id名稱",而不是class="類名稱"。

2、id選擇符的前面是井號(#)號,而不是英文圓點(.)。

3、id屬性的值既為當前標籤的id,盡量見名思意,語義化。

相同點:可以應用於任何元素
不同點:

1、id選擇器只能在文件中使用一次。與類選擇器不同,在乙個html文件中,id選擇器只能使用一次,而且僅一次。而類選擇器可以使用多次。

下面**是正確的:

膽小如鼠

勇氣來回答老師提出的問題。

而下面**是錯誤的:

膽小如鼠

勇氣來回答老師提出的問題。

2、可以使用類選擇器詞列表方法為乙個元素同時設定多個樣式。我們可以為乙個元素同時設多個樣式,但只可以用類選擇器的方法實現,id選擇器是不可以的(不能使用 id 詞列表)。

下面的**是正確的(完整**見右側**編輯器)

.stress

.bigsize

到了三年級下學期時,我們班上了一節公開課...

上面**的作用是為「三年級」三個文字設定文字顏色為紅色並且字型大小為25px。

下面的**是不正確的(完整**見右側**編輯器)

#stressid

#bigsizeid

到了三年級下學期時,我們班上了一節公開課...

上面**不可以實現為「三年級」三個文字設定文字顏色為紅色並且字型大小為25px的作用。

CSS基礎選擇器 類選擇器 id選擇器

選擇器的作用 根據不同的需求把不同的標籤選出來 是由單個選擇器組成的 包括 標籤選擇器 類選擇器 id選擇器 萬用字元選擇器 1 標籤選擇器 指用html標籤名稱作為選擇器,按標籤名稱分類,為頁面中某一類標籤指定統一的css樣式。優點 能夠快速為頁面中同型別的標籤統一設定樣式。缺點 不能設計差異化樣...

css的類選擇器 和id選擇器

css 語法由三部分構成 選擇器 屬性和值 selector選擇器 selector 通常是你希望定義的 html 元素或標籤,屬性 property 是你希望改變的屬性,並且每個屬性都有乙個值。屬性和值被冒號分開,並由花括號包圍,這樣就組成了乙個完整的樣式宣告 declaration body上面...

類選擇器和ID選擇器

什麼是選擇器?每一條css樣式宣告 定義 由兩部分組成,形式如下 選擇器在 之前的部分就是 選擇器 選擇器 指明了 中的 樣式 的作用物件,也就是 樣式 作用於網頁中的哪些元素。類選擇器 類選擇器在css樣式編碼中是最常用到的,格式如下 類選擇器名稱 注意 1.英文圓點開頭 2.類選擇器名稱可以任意...