在CSS中,我們經常使用各種符號來定義樣式,除了常見的{}、:、;符號外,還有許多其他的符號可以運用。下面將介紹一些CSS中更多的符號。
// ~符號 表示選擇相鄰的兄弟元素
p~ul {
margin-top: 20px;
}
上述代碼表示將緊接在p元素后的ul元素的margin-top屬性設置為20px。
// * 符號 表示選擇所有的元素
* {
margin: 0;
padding: 0;
}
上述代碼表示讓所有的元素的margin和padding屬性都為0。
// $ 符號 用于變量定義
$bg-color: #f2f2f2;
body {
background-color: $bg-color;
}
上述代碼表示定義一個變量$bg-color為#f2f2f2,然后可以在其他CSS規則中使用這個變量。
// | 符號 用于屬性選擇器
a[href|="example"] {
color: red;
}
上述代碼表示選擇href屬性值以“example”開頭的a元素,并將其顏色設置為紅色。
除了以上介紹的符號外,還有許多其他有用的符號,如^、$、+、>、[ ]等等。為了更好的了解這些符號的用法,建議深入學習CSS語言。
上一篇css中最小寬度的設置
下一篇css中更改圖片的尺寸