寂寞部屋
- 关注互联网,关注生活
关注互联网,关注生活
2019年五月
« 4月    
 12345
6789101112
13141516171819
20212223242526
2728293031  
  • 日志总数:553 篇
  • 浏览总量:2,433,003 次
  • 运行天数:612 天
  • 建站时间:2017-9-14
  • 最后更新:2019-4-2

一、了解XHTML中的常用选择符

在了解XHTML中的常用选择符之前,我们先来温习下XHTML基本常识。
XHTML可以看做是一种由HTML向XML的过渡时期的网页结构语言,用于替代HTML,帮助开发适应新的标准以便转向XML。
XHTML在语法上比HTML要求更为严格,因此在开始编写XHTML时,一定要严格符合XHTML的语法规则。新的语法规则主要表现在以下几个方面:
1、属性名称必须小写
如:<span class="list">
class是一个属性名,不能使用CLASS或Class形式。
2、属性值必须用双引号
如:<div id ="content">
不能写作<div id = content>的形式。
3、属性不能简写
HTML中的表单属性<input checked>及<option selected>
在XHTML中正确写法为<input checked="checked"/>及<option selected="selected"/>
4、必须使用结束标签
成对使用的标签如:<div>……</div>及<p>……</p>,
单体标签必须使用正斜线作为结束,如:
<img scr=""/>及<br/>

XHTML中的常用选择符:
1、类型选择符
:是以网页中已有的标签类型作为选择符,如:
body{}
div{}
span{}
2、群组选择符:除了对单个XHTML对象进行样式指定外,也可以对一组对象样式指定:
h1,h2,h3,p,span{font-weight:700;font-size:15px;color:#33ccff;}
使用逗号对选择符分隔,使得里面的h1,h2,h3,p,span都具有相同的样式,益于减少代码量,改善CSS代码结构。
3、包含选择符:主要使用于指定某个对象中的子对象样式。中间使用空格隔开。如:
XHTML代码如下:
<p>这是一段落标记,在这里的<span>span内文本<span>实现加粗样式</p>
CSS代码如下:
p span{font-weight:bold;}
表示仅对P对象下的span子对象实现加粗样式。
4、id及class选择符:是CSS提供给用户自定义标签名称的选择符模式。有利于CSS的扩展性与可读性。
如:
<img id="pic_left"></img>与<img id="pic_right"></img>是两个不同的元素。
注意:在同一个页面中,一个id名称必须唯一。
对应CSS如下:
#pic_left{}
#pic_right{}
用不同的id来区分不同的对象,从而实现不同的样式。
而class的好处在于为不同的对象指派相同的样式,从而实现了代码的重复使用性,缩减了代码量。
<p class="title"></p>
<h4 class="title"></h4>
把类为title的属性同时应用到P标签和h4标签下,实现某个属性的共用。

5、组合选择符:对于所有的CSS选择符,均可以组合使用:
h1 .title{}
表示对h1标签下的所有class为title的标签。
#content h2{}
表示对id为content的标签下的h2标签。
h3#content h4{}
表示id为content的h3标签下的h4标签。其实此处完全可以表示成这样:#content h4{},因为已经把此h3标示成了id为content,而id又是唯一的。

6、伪类及伪对象:由CSS自动自持,不能自定义,必须要按标准格式进行。
a:hover{}
a:visited{}

7、通配符的使用
*{color:25px}

 

原文地址:http://www.chaojibaby.com/blog/article.asp?id=105

本站原创文章,请勿复制转载
版权声明:除特别注明外,本站所有文章均为原创,未经许可请勿复制、转载
2007-11-14
2,150 views
标签: , ,
暂无评论

发表评论

注意: 评论者允许使用'@user空格'的方式将自己的评论通知另外评论者。例如, ABC是本文的评论者之一,则使用'@ABC '(不包括单引号)将会自动将您的评论发送给ABC。使用'@all ',将会将评论发送给之前所有其它评论者。请务必注意user必须和评论者名相匹配(大小写一致)。