DIV+CSS星号(*)选择器
CSS DIV+CSS星號(*)選擇器
星號(*)選擇器也稱為通用選擇器、通配符選擇符等,星號(*)表示通配符。通配符選擇符用于對頁面所有元素(HTML中所有標簽)應用樣式。例如:
*{margin:0;padding:0;font-family:宋體;}將網頁HTML中所有標簽的padding設置為0、margin設置0,字體設置為宋體。
特殊情況下,可以對特定元素的所有后代元素應用樣式。例如,將頁面中p標簽包含的所有后代元素的字體設置為紅色。例如:
<style type="text/css"> <!-- *{color:#000000;} /*將頁面中所有顏色設置為黑色*/ p{color:#0000FF;} /*將p標簽中的顏色設置為藍色*/ p *{color:#FF0000;} /*將p標簽中的所有后代元素的顏色設置為紅色*/ --> </style>將星號(*)選擇器應用到HTML網頁元素中。代碼如下:
<body> <p>這是藍色的文字</p> <div>這是黑色的文字</div> <p>這是藍色的!<span>這是紅色的!</span><em>這也是紅色的!</em><strong><span>這也是</span>紅色的!</strong>真奇妙!</p> </body>星號(*)選擇器直接應用到了頁面中的所有HTML元素上。
源代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>CSS對特定元素的所有后代元素應用樣式示例-www.baike369.com</title> <style type="text/css"> <!-- *{color:#000000;} /*將頁面中所有顏色設置為黑色*/ p{color:#0000FF;} /*將p標簽中的顏色設置為藍色*/ p *{color:#FF0000;} /*將p標簽中的所有后代元素的顏色設置為紅色*/ --> </style> </head> <body> <p>這是藍色的文字</p> <div>這是黑色的文字</div> <p>這是藍色的!<span>這是紅色的!</span><em>這也是紅色的!</em><strong><span>這也是</span>紅色的!</strong>真奇妙!</p> </body> </html>下面在瀏覽器中瀏覽星號(*)選擇器的顯示效果。如下圖所示:
CSS選擇器內使用星號(*)
在CSS選擇器內使用星號(*),一般用于區別IE6和IE8、IE6和Firefox、IE7和IE8、IE7和Firefox瀏覽器之間屬性的CSS HACK。即(*)號是指定為IE6和更低版本來使用。非IE的瀏覽器就不認得。
如:
.baike369{border:1px solid #000;width:100px;*width:200px;}一個寬度為100px,一個帶星號(*)的寬度為200px。我們會發現在IE6和IE7中寬度為200px,而在IE8及以上MSIE版本、谷歌瀏覽器、火狐(FF)瀏覽器卻顯示為100px寬度。
提示
由于星號選擇器沒有指定任何特殊類型的標簽,因此難以預測它在所有頁面均由各種HTML標簽組成的網站上所展現出來的效果。使用CSS的繼承可以解決這個問題。
由于通配選擇器會影響所有的元素,因此除了清除瀏覽器的內置樣式以外,應謹慎使用。
總結
以上是生活随笔為你收集整理的DIV+CSS星号(*)选择器的全部內容,希望文章能夠幫你解決所遇到的問題。