Sealyu

--- 博客已迁移至: http://www.sealyu.com/blog

  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  618 随笔 :: 87 文章 :: 225 评论 :: 0 Trackbacks
Sealyu 2009-9-9

一直对这个地方糊里糊涂,这次借了一本书,争取将css强化一下.
CSS的几种选择器:
  • 标记选择器:
    定义html或者xhtml标签的通用CSS样式,定义语句前无前缀。例如:
<style>
h1
{
  color
:red
}
</style>
<h1>This is test.</h1>

  • 类别选择器:
    通过定义单独的class来定义对应样式,定义语句前缀为 '.'。例如:
<style>
.red
{
  color
:red
}
</style>
<p class="red">xxxxxx</p>

  • ID选择器:
    通过对应html元素的标签ID来定义对应样式,定义语句前缀为 '#'。例如:
<style>
#
firstPar{
  color
:red
}
</style>
<p id="firstPar">xxxxxx</p>

  • 复合选择器:

另外,可以通过这几种选择器组合定义复合选择器,例如:
<style>
p
{
  color
:red
}
p .firstPar
{
  color
:blue
}
.firstPar
{
  color
:green
}
</style>
<p>普通段落</p>
<p class="firstPar">第一段</p>
<h1 class="firstPar">第一段标题</h1>

  • 全局选择器:
如果想要一个页面中所有html标记使用同一种样式,可以定义一种全局选择器: '*'。例如:
<style>
*
{
  color
:red;
  font-size
:10px
}
</style>
<p>普通段落</p>
<p>第一段</p>
<h1>第一段标题</h1>

  • 后代选择器:
可以通过嵌套的方式,对特殊位置的html标记进行声明。后代选择器的写法就是把外层的标记写在前面,内层的标记写在后面,之间用空格分隔。当标记发生嵌套时,内层的标记就成为外层标记的后代。例如:
<style>
p span
{
  color
:red;
  font-size
:10px
}
span
{
  color
:green
}
</style>
<p>嵌套使<span>用CSS</span>标记的方法</p>
嵌套之外的<span>标记</span>不生效

优先级规则为:
行内定义>ID选择器>类别选择器>标记选择器


posted on 2009-09-09 16:38 seal 阅读(2522) 评论(1)  编辑  收藏 所属分类: CSS

评论

# re: CSS的几种选择器 2009-09-10 10:08 于翔
学习了   回复  更多评论
  


只有注册用户登录后才能发表评论。


网站导航: