您好!欢迎来到静学网! 注册 登入
  • 致力提供中国优质IT教程及新媒体资讯,打造中国品牌教育先锋。

CSS选择器类型及具体使用方法详解(一)

课程目录 SEO资深顾问 次浏览
选择器是CSS中一大特色,CSS通过选择器可以轻而易举的改变网页的整体布局及美观程度,把网页的样式改变成为你想要的样子,而不是固定模式,因此我们如何更加简洁、灵活的改变网页的外观,选择器在这一过程中扮演了重要的角色,它可以改变任意一个html标签的样式,让其更具有活力,符合用户审美标准。下面我们起来细说选择器那些事。
 
一  CSS 派生选择器
 
派生选择器在CSS1中又叫上下文选择器(contextual seletctors),它是通过上下文的关系式来改变内部标签样式。比如以下示例,我们要改变span中的文字,为了更加简洁,我们应该使用派生选择器:
 
<div>
<p>红色<span>改变这里</span></p>
</div>
 
<style type="text/css">
p span {
color: red;
     }
</style>
 
CSS 元素选择器
 
与派生选择器不同的是CSS元素选择器是单独的标签存在,也是最基本的文档元素,比如li、ul、h1、em等,如果我要改变整个网页的字体和颜色,元素选择器派场就大了,代码示例如下:
html{
  color:red;
  font-size:15px;
}
 
CSS选择器分组
css选择分组其实就是元素选择器的组合,规则是用逗号隔开就行了,注意一定不要漏了逗号,不然意义就变了。根据分组的不同又可分为选择器分组、通配符选择器、声明分组、综合性分组。
CSS选择器
1)选择器分组
 
<p1>改变这里</p1>
<h1>改变这里</h1>
<style>
p1,h1{
   color:red;
}
</style>
2)通配符选择器
通配符选择器是CSS2一项新的选择器,符号位*号,只要引入它就可改变整个页面的。常用语修改边距。
*{
padding:0px;
margin:0px;
}
 
3) 声明分组
声明分组就是同一个标签拥有多个属性的时候,就可以派得上用场。
h1{color:red;}
h1{font-family:"Times New Roman",Georgia,Serif }
显然这样做不仅不美观,而且效率受到影响,因此我们可以改变成为。
 
h1{
 color:red;
 font-family:"Times New Roman",Georgia,Serif;
}
 
下节我们继续讲解选择器,特别是类选择器和ID选择器是经常用到的。
 

静学网 , 版权所有丨如未注明 , 均为原创丨转载请注明CSS选择器类型及具体使用方法详解(一)
顶一下
(1)
踩一下
(0)
畅所欲言
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码:点击我更换图片
最新评论
友情链接:
自学网
本网站所刊载信息,不代表静学网观点。 刊用本网站稿件,务经书面授权或注明来源。 未经授权禁止转载、摘编、复制及建立镜像,违者将依法追究法律责任。 投稿邮箱:1870447831@qq.com | 举报邮箱:1870447831@qq.com