CSS选择符

2012年08月14日22:00 来源:作者:网友评论0

  CSS语法结构简介(CSS选择符)

  2007-05-29 21:46

  →CSS属性与选择符

  CSS语法结构由三部分组成:选择符(Selector),属性(Propetry),和值(Value)

  如:Selector{Property:Value;}

  →类型选择符

  所谓类型选择符,是指以网页中已有的标签类型作为名称的选择符

  如:body,div,span,p,h1,h2......

  →群组选择符

  除了对单个XHTML对象进行样式指定,同样可以对一组对象进行相同的样式指派

  如:h1,h2,h3,p,span{font-size:12px;font-family:arial}

  使用逗号对选择符进行分隔,这样做的好处是对于页面中需要使用相同样式的地方只需要书写一次样式表即可实现,减少代码量,改善CSS代码结构

  →包含选择符

  包含选择符指选择符组合中前一个对象包含后一个对象,对象之间使用空格作为分隔符

  如:h1 span{font-weight:bold;}

  h1标签之下的span标签将被使用font-weight:bold的样式设置

  包含选择符除了可以二者包含,也可以多级包含

  如:body h1 span strong{font-weight:bold;}

  →id及class选择符

  id选择符及class选择符均是CSS提供的由用户自定义标签名称的一种选择符模式,用户可以使用id及class对页面中的XHTML标签进行自定义名称,从而达到扩展XHTML标签及组合XHTML标签的目的

  id选择符:对于一个页面而言,其中的每一个标签(后其他对象),均可以使用一个id=""的形式对id属性进行一个名称的指派,在网页中每一个id名称只能使用一次,如:<div id="content"></div>

  在CSS中,id选择符使用#符号进行标识

  如:#content{font-size:14px;line-height:130%;}

  class选择符:class应当是对XHTML多个标签的一种组合,class直译为类或类别,与id不同的是,class允许重复使用,如页面中的多个元素都可以使用同一个class定义

  如:<div class="p1"></div>

  <h1 class="p1"></h1>

  <h3 class="p1"></h3>

  class在CSS中使用符号.进行标识

  →标签指定式选择符

  如果既想使用id或class,也想同时使用标签选择符,可以如下

  h1#content{} 表示针对所有id为content的h1标签

  h1.p1{} 表示针对所有class为p1的h1标签

  标签指定式选择符在对标签选择的精确度上介于标签选择符及id/class选择符之间

  →组合选择符

  对于所有CSS选择符而言,无论是什么样的选择符,均可以进行组合使用

  如:h1 .p1,#content h1{}

  h1#content h2{} id为content的h1标签下的h2标签

  →伪类及伪对象

  伪类及伪对象是一种特殊的类和对象,由CSS自动支持,属CSS的一种扩展型类和对象,名称不能被用户自定义,使用时只能够按标准格式进行应用

  如:a:hover{background-color:#000000;}

  伪类和伪对象由以下两种形式组成

  1)选择符:伪类

  2)选择符:伪对象

  →伪类用途

  :link a链接标签的未被访问前的样式

  :hover 对象在鼠标移上时的样式

  :active对象被用户点击及被点击释放之间的样式

  :visiteda链接对象被访问后的样式

  :focus对象成为输入焦点时的样式

  :first-chlid对象的第一个子对象的样式

  :first对于页面的第一页使用的样式

  →伪对象用途

  :after设置某一个对象之后的内容

  :first-letter 对象内的第一个字符的样式设置

  :first-line对象内第一行的样式设置

  :efore设置某一个对象之前的内容

  →通配选择符

  通配是指使用字符替代不确定的字

  CSS的通配选择符使用*作为关键字

  如:*{color:blue;}

  *号使用表示所有的对象

温馨提示:玩家可通过手机登陆duowan.cn阅读多玩新闻。

分享到:

联系我们

  • 联系电话:010-82737919转8121
  • 联系邮箱:tiger_LHB#163.com