| =和^ = css之間的區別

有什麼區別：|=和^=在css中？| =和^ = css之間的區別

由於這個鏈接，它不是一個，但他們爲什麼會打擾兩件事是重複的。 http://www.w3schools.com/cssref/css_selectors.asp

[屬性| =值]和[屬性^ =值]

首先具有

選擇每一個元素，它的src屬性值始於「HTTPS」

第二個有

個選擇與郎所有元素屬性值開始「EN」

來源

2013-03-28 radu florescu

你不應該使用W3Schools的作爲源！看看[W3Fools]（http://w3fools.com/） – MarcinJuraszek 2013-03-28 09:20:55

是的，但由於谷歌的搜索引擎優化，我不斷從第一頁搜索他們。 – 2013-03-28 09:24:37

我知道這一點。然而，下次你會知道你應該跳過搜索結果中的這些鏈接:) – MarcinJuraszek 2013-03-28 09:26:05

我覺得W3C文檔中的官方介紹說，這一切：

E[foo|="en"] - 的E元素foo的屬性值是一個連字符開頭值的分隔列表EN

E[foo^="bar"] - 的E元素foo的屬性值開始正好與字符串「bar」

Always try to avoid using w3schools - it has very poor quality。

要獲得好的文檔，請轉到MDN或Sitepoint或使用官方W3C Document。

基本上|=選擇器是與化合物的類和屬性的語言有用。

<div class="wrapper-inner"><span lang="en-GB">...</span></div> 

div[class|='wrapper']{/*...*/} 
span[lang|='en']{/*...*/}

^=更一般選擇「字符串匹配」喜歡你的屬性的第一個字母。

來源

2013-03-28 09:19:56 Christoph

你能否爲此提供官方文檔鏈接？ – 2013-03-28 09:21:13

參考https://developer.mozilla.org/en-US/docs/CSS/Attribute_selectors。官方網址：http：//www.w3.org/TR/css3-selector/#attribute-selectors – 2013-03-28 09:21:16

我會授予你選中的答案，儘管兩個答案都是正確的，但你的答案更加完整。 – 2013-03-28 09:23:47

W3Schools的不是知識（check that site）的良好來源。你應該依靠官方CSS specification：

E[foo^="bar"]的E元素「foo」的屬性值開始正好與字符串「bar」

E[foo|="en"]的E元素「foo」的屬性有值的連字符隔開的列表開始（從左側）與「EN」用法

實例：

以下選擇器表示的量，值的元件的 hreflang屬性開頭「EN」，包括「連接」，「EN-US」，和「EN-利物浦式」：

a[hreflang|="en"]

以下選擇表示HTML對象，引用一個圖像：

object[type^="image/"]

來源

2013-03-28 09:22:15 MarcinJuraszek

爲什麼在W3C官方文檔發佈時使用w3schools？

W3C CSS3 Selectors

W3C CSS2 Selectors

E[foo^="bar"]的E元素「foo」的屬性值完全開始字符串「bar」（屬性選擇CSS3）

E[foo|="en"]的E元素爲「foo 「屬性具有以」en「（屬性選擇器CSS2）開頭（從左側開始）的以連字符分隔的值列表

來源

2013-03-28 09:24:23

請檢查以下示例。你會在兩個選擇器之間得到更好的理解。

/* select all lang attribute starting with "en" */ 
 
[lang^=en] { 
 
    border: 1px solid red; 
 
} 
 

 
/* select all hyphen-separated lang attribute starting with "en" */ 
 
[lang|=en] { 
 
    background: yellow; 
 
}

<p lang="en">Hello!</p> 
 
<p lang="en-us">Hi!</p> 
 
<p lang="en_gb">Ello!</p>

來源

2017-07-10 02:40:19

| =和^ = css之間的區別

回答

相關問題