css 通配符(*,#,.)

html-css017

css 通配符(*,#,.),第1张

这个也没有别的意思

#div_test #只代表这是一个ID选择器

。仅代表是一个类别选择器

#号后面的是元素的ID

。号后面的是元素类名

如果没# .这种标识符 那就不能区分div_test 是ID选择器,还是类别选择器

代码就无法执行,,,

这个学久了自然就能理解。。。。

刚开始学的时候,我也不理解

还有就是那个标签选择器,

为什么会叫标签选择器,而不叫元素选择器呢

那是因为标签名就是元素名

元素是一个整体的概念,元素名仅仅只代表元素的名称

p元素,它的名称就是p

<p>这是个标签,标签名就是P

标签是由元素名与<>组成

而元素是由开始标签与结束标签组成

*是通配符,,

表示所有

* { margin:0}

重置所有元素的边距

CSS3中,合理的使用通配符,可以大大提高效率,以下为测试示例。

“^”开头字母匹配;“$”结尾字符匹配;“*”包含字符匹配

<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8 />

<title>在页面上使用google地图示例</title>

<style type="text/css">

[id="qq"]{ background:red}

[id^="b"]{ background:yellow}

[id$="c"]{ background:green}

[id*="f"]{ background:orange}

</style>

</head>

<body>

<div>test</div>

<div id="qq">这个是指定ID情况下的样式</div>

<div id="begin">这个是用来测试开头字符为“b”</div>

<div id="cc">这个是用来测试结尾字符为“c”</div>

<div id="fcq">这个是用来测试id中含有"f".</div>

</body>

</html>