網頁

2019/7/27

CSS Universal selector 全體選擇器

本篇介紹CSS selectorsUniversal selector(全體選擇器)的用法。

Universal selector以星號(asterisk)*表示,代表選擇HTML文件的所有元素。

例如下面範例在<style>...</style>中(即內部樣式表(Internal style sheet))以universal selector選取全部的元素來套用CSS樣式,把所有元素的文字變成紅色(color:red)。

<!DOCTYPE html>
<html>

<head>
    <style>
        * {
           color:red; 
        }
    </style>
</head>

<body>

    <div>
        <h1>區塊一標題</h1>
        <p>區塊一段落文字</p>
    </div>

    <div>
        <h1>區塊二標題</h1>
        <p>區塊二段落文字</p>
    </div>

</body>
</html>


Universal selector通常的使用時機為希望文件中全部元素都有同樣的CSS效果,例如所有文字預設都是灰色;或是有一致的字型(font-family);或是有一致的內外邊距(marginpadding)等。


參考:

沒有留言:

張貼留言