DB

WBOY
發布: 2016-06-07 15:38:57
原創
1297 人瀏覽過

理想很丰满,现实很骨感。为了丰满起来,再接再厉吧兄弟! 这里我只说一些在某些教科书上很少或根本不曾提及的选择器的用法。 1.类选择器 比如说: .class1{font:3cm}.class2{color:red} 如果样式表里出现这样的选择器呢? .class1.class2{background:yellow

理想很丰满,现实很骨感。为了丰满起来,再接再厉吧兄弟!



这里我只说一些在某些教科书上很少或根本不曾提及的选择器的用法。


1.类选择器


比如说:

.class1{font:3cm}
.class2{color:red}
登入後複製


如果样式表里出现这样的选择器呢?

.class1.class2{background:yellow}
登入後複製


2.根据元素属性来选择元素

还是用例子来说明问题:

a[alt]{border:3px solid red;}
登入後複製

比如说:

 CSDN

扩展:

*[title]{font-weight:bold;}表示选择所有具有"title“属性的元素。

a[href="http://www.csdn.net"]{font-weight:bold;}

img[title~="Figure"]{border:1px solid gray;}

[title^="bar"] 选择title属性以"bar“开头的所有元素。

[title$="bar]  选择title属性以"bar"结尾的所有元素。

[title*="bar"]  选择title属性中包含子字符串"bar”的所有元素。

此外还有:

父子选择器:h1>strong{};表示只选择作为h1子元素的strong元素。

兄弟选择器:h1+strong{};表示选择紧邻着h1的兄弟strong元素。


相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板