1. 引言 上一节《css知多少(5)——选择器》最后提到,选择器类型过多将导致一些问题,是什么问题呢?咱们直接举例子说明。 上图中,css中的两个选择器都是针对<span>的,而且两个设置的颜色不一样,这里的<span>到底听从谁的命令? 上面 ...
. 引言 从本节开始,就进入本系列的第二个部分 css和html的结合 说白了就是选择器。 CSS中定义了样式,如何将这些样式设置到相应的html节点上 就不得不通过选择器。让浏览器知道css选择了哪一个dom节点,浏览器就会乖乖的把相应的样式渲染成视图。 至于css能把页面渲染成什么样子,这是本系列的第三部分。 第一部分讲css样式的加载和层叠,第二部分讲选择器以及选择器的等级,第三部分讲呈现 ...
2015-02-10 08:22 8 12461 推荐指数:
1. 引言 上一节《css知多少(5)——选择器》最后提到,选择器类型过多将导致一些问题,是什么问题呢?咱们直接举例子说明。 上图中,css中的两个选择器都是针对<span>的,而且两个设置的颜色不一样,这里的<span>到底听从谁的命令? 上面 ...
前面的话 CSS的一个核心特性是能向文档中的一组元素类型应用某些规则,本文将详细介绍CSS选择器 [注意]关于选择器兼容性的详细信息移步至此 通配选择器 星号*代表通配选择器,可以与任何元素匹配 元素选择器 文档的元素是最基本的选择器 ...
选择器的用处就是告知浏览器,我这一大堆的样式要用在哪些元素 选择器很重要,学好了,可以减少很多CSS代码,不用像以前一样,一大堆类选择器。 以下为了方便查看CSS代码,我采用内联样式的方法,但在实际开发中,建议用外联样式,这有利于页面的性能优化。 id选择器 id选择器,要在标签添加id ...
一、基本选择器 1. * 通用元素选择器,匹配任何元素 2. E 标签选择器,匹配所有使用E标签的元素 3. .info class选择器,匹配所有class属性中包含info的元素 4. #footer id选择器,匹配所有id属性等于footer的元素 二、多元素的组合选择器 ...
1、标签选择器 2、类选择器 3、id选择器 4、通配符选择器(*) 5、连接类伪类选择器(a:hover) 6、结构伪类选择器(first-child(),last-child(),nth-child(),nth-last-child()) 7、目标伪类选择器(:target 被选 ...
1. id选择器(#myid) 根据id的值选择元素 2. 类选择器(.myclassname) 根据class的值选择元素 3. 标签选择器(div,h1,p) 根据标签选择元素 4.相邻选择器/兄弟选择器(h1+p) 匹配紧跟第一个选择器,并且匹配第二个选择器内的元素,如紧跟h1元素后 ...
一、后代选择器 选取指定元素的后代元素 与子元素选择器相比,后代选择器选取的不一定是直接后代(儿子),而是作用于所有后代元素(儿子、孙子、重孙…)都可以。 实例:(选取类为 box的元素的 id为aa后代元素) HTML CSS 二、(> ...
css的选择器是还是比较富的,主要的css选择器如下: 标签选择器(如:body,div,p,ul,li) .类选择器(如:class="head",class="head_logo") ID选择器(如:id="name",id="name_txt") 全局 ...