選擇器的基本概念

2021-10-03 05:39:36 字數 1275 閱讀 9753

1.選擇器:style標籤中定義的屬性具有選擇作用域的功能,因此我們把這種屬性稱為選擇器。

2.選擇器的定義格式:

選擇器名稱

選擇器的分類

* 分類:

1. 基礎選擇器

1. id選擇器:選擇具體的id屬性值的元素.建議在乙個html頁面中id值唯一

* 語法:#id屬性值{}

2. 元素選擇器:選擇具有相同標籤名稱的元素

* 語法: 標籤名稱{}

* 注意:id選擇器優先順序高於元素選擇器

3. 類選擇器:選擇具有相同的class屬性值的元素。

* 語法:.class屬性值{}

* 注意:類選擇器選擇器優先順序高於元素選擇器

2. 擴充套件選擇器:

1. 選擇所有元素:

* 語法: *{}

2. 並集選擇器:

* 選擇器1,選擇器2{}

3. 子選擇器:篩選選擇器1元素下的選擇器2元素

* 語法: 選擇器1 選擇器2{}

4. 父選擇器:篩選選擇器2的父元素選擇器1

* 語法: 選擇器1 > 選擇器2{}

5. 屬性選擇器:選擇元素名稱,屬性名=屬性值的元素

* 語法: 元素名稱[屬性名="屬性值"]{}

6. 偽類選擇器:選擇一些元素具有的狀態

* 語法: 元素:狀態{}

* 如: * 狀態:

* link:初始化的狀態

* visited:被訪問過的狀態

* active:正在訪問狀態

* hover:滑鼠懸浮狀態

屬性

1. 字型、文字

* font-size:字型大小

* color:文字顏色

* text-align:對其方式

* line-height:行高

2. 背景

* background:

3. 邊框

* border:設定邊框,符合屬性

4. 尺寸

* width:寬度

* height:高度

5. 盒子模型:控制布局

* margin:外邊距

* padding:內邊距

* 預設情況下內邊距會影響整個盒子的大小

* box-sizing: border-box; 設定盒子的屬性,讓width和height就是最終盒子的大小

* float:浮動

* left

* right

JQuery基本概念,語法,選擇器,事件

基本概念 jquery是乙個js庫,能夠幫助我們輕鬆實現一些原本可能比較麻煩的功能。jquery每個版本又有兩個小版本 壓縮版和未壓縮版,壓縮版檔案較小,但沒有排版和注釋,所以不便於閱讀 而未壓縮版檔案較大,有排版和注釋,便於閱讀。jquery實際上就是乙個js檔案,載入到頁面就可以直接使用了。sr...

jquery總結01 基本概念和選擇器

dom元素和jquery元素的區別 dom元素支援dom元素自帶的屬性和方法,jquery元素支援jquery元素自帶的屬性和方法 dom var div document.getelementbyid a jquery var div a dom轉jquery var a div jquery轉d...

Jquery選擇器 基本選擇器

jquery作為我們常用前端工具之一,實際專案中常用的的選擇器有id選擇器 id 元素選擇器 element 樣式選擇器 class 概述 根據給定的id匹配乙個元素。使用任何的元字元 如 作為名稱的文字部分,它必須被兩個反斜槓轉義 引數 id,用於搜尋的,通過元素的 id 屬性中給定的值。示例 查...