009_CSS分组选择器
生活随笔
收集整理的這篇文章主要介紹了
009_CSS分组选择器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1. 選擇器的分組
1.1. 你可以對選擇器進行分組, 這樣, 被分組的選擇器就可以分享相同的聲明。將多個選擇器放在規則左邊, 然后用逗號分隔, 就定義了一個分組。逗號告訴瀏覽器, 規則中包含多個不同的選擇器。
1.2. 可以將任意多個選擇器分組在一起, 對此沒有任何限制。
1.3. 例如, 如果您想把很多元素顯示為灰色，可以使用類似如下的規則:
body, h2, p, table, th, td, pre, strong, em {color: gray; }2. 結合選擇器和聲明的分組
2.1. 我們可以在一個規則中結合選擇器分組和聲明分組, 就可以使用很少的語句定義相對復雜的樣式。
2.2. 下面的規則為所有標題指定了一種復雜的樣式:
h1, h2, h3, h4, h5, h6 {color: gray;background: white;padding: 30px;border: 1px solid black;font-family: Verdana; }3. 例子
3.1. 代碼
<!DOCTYPE html> <html><head><title>CSS分組選擇器</title><meta charset="utf-8" /><style type="text/css">h1, h2, h3, h4, h5, h6 {color: gray;background: white;padding: 30px;border: 1px solid black;font-family: Verdana;}</style></head><body><h1>This is heading 1</h1><h2>This is heading 2</h2><h3>This is heading 3</h3><h4>This is heading 4</h4><h5>This is heading 5</h5><h6>This is heading 6</h6></body> </html>3.2. 效果圖
總結
以上是生活随笔為你收集整理的009_CSS分组选择器的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 008_CSS属性选择器
- 下一篇： 010_CSS后代选择器