前端技術學習之選擇器(二)

2021-07-25 21:36:28 字數 674 閱讀 5107

2,

根據屬性值選擇

/*[title~=hello] /*如果含有值 */*/

[title="world"] /*如果值等於*/ 。

執行效果:

3,特定

屬性選擇型別

*[title|="h"] 當有

屬性title並且title屬性的值是以h或者h-開頭的元素

4,使用

萬用字元的屬性

選擇器

e[att^="val"],選擇器匹配元素e,且e元素定義了屬性att,att       的屬性值是以val開頭的任何字串。

e[att$="val"],選擇器匹配元素e,且e元素定義了屬性att,att的屬性值以val結尾的任何字串。

e[att*="val"],選擇器匹配元素e,且元素定義了屬性att,att屬性值任意位置包含

了"val"。

**例子:

我鏈結的是pdf檔案

我類名是icon

我的title是more

執行效果:

前端技術學習之選擇器(四)

四,結構性偽類選擇 器 empty empty選擇器表示的就是空,用來選擇沒有任何內容的元素,真的是什麼內容都沒有,空格都不能有。舉例 第乙個 有文字內容,第二個只有乙個空格,第三個為空。empty 就可以選中第三個 給它新增樣式。我是乙個段落 執行效果 五,結構性 偽類選擇 器 target ta...

前端學習之 CSS 選擇器

css選擇有三種 html 元素指的是從開始標籤 start tag 到結束標籤 end tag 的所有 元素選擇器通過標籤名選擇元素。p元素 p元素p元素 效果 id選擇器通過id選擇元素,乙個元素的id應該是唯一的。另乙個元素不應該重複使用 p標籤 p1標籤 效果 當需要多個元素,都使用同樣的c...

學習前端之CSS選擇器

css選擇器是個啥子東東?別看它取了個高階的名字,其實就相當於給目標人物取名字,例如 div 我要給上面的div標籤加樣式,首先就要找到它,簡單粗暴的一種,就是直接取div div這樣我們就能給div加樣式了。廢話不多說,選擇器有哪些呢?標籤選擇器 上面的例子就是標籤選擇器,直接是用的標籤名,寫di...