css可以对html实现一对一或一对多的页面控制,不同的css选择器对html的控制是不一样的
本篇博客大量参考w3school网站的资料
++++++++++++++CSS 元素选择器
元素选择器就是将html标签作为css的标签
最常见的 CSS 选择器是元素选择器。换句话说，文档的元素就是最基本的选择器。
<html>
<head>
<style type="text/css">
html {color:black;}
p {color:blue;}
h2 {color:silver;}
</style>
</head>
<body>
<h1>这是 heading 1</h1>
<h2>这是 heading 2</h2>
<p>这是一段普通的段落。</p>
</body>
</html>
效果;
这是 heading 1
这是 heading 2
这是一段普通的段落。
++++++++++++++++++++++++CSS 类选择器
类选择器允许以一种独立于文档元素的方式来指定样式。
该选择器可以单独使用，也可以与其他元素结合使用。
提示：只有适当地标记文档后，才能使用这些选择器，所以使用这两种选择器通常需要先做一些构想和计划。
要应用样式而不考虑具体设计的元素，最常用的方法就是使用类选择器。
<html>
<head>
<style type="text/css">
.important {color:red;}
p.important {color:red;}与.important {color:red;}一样的效果
</style>
</head>
<body>
<h1 class="important">This heading is very important.</h1>
<p >This paragraph is very important.</p>
</body>
</html>
效果:
This heading is very important.
This paragraph is very important.
+++++++++++++++++++css id选择器
CSS ID 选择器
在某些方面，ID 选择器类似于类选择器，不过也有一些重要差别。
语法
首先，ID 选择器前面有一个 # 号 - 也称为棋盘号或井号。
请看下面的规则：
*#intro {font-weight:bold;}
与类选择器一样，ID 选择器中可以忽略通配选择器。前面的例子也可以写作：
#intro {font-weight:bold;}
这个选择器的效果将是一样的。
第二个区别是 ID 选择器不引用 class 属性的值，毫无疑问，它要引用 id 属性中的值。
以下是一个实际 ID 选择器的例子：
<html>
<head>
<style type="text/css">
#important {color:red;}
</style>
</head>
<body>
<h1 id="important">This heading is very important.</h1>
<p >This paragraph is very important.</p>
</body>
</html>
效果:
This heading is very important.
This paragraph is very important.
++++++++++++++++++++++++CSS 伪类用于向某些选择器添加特殊的效果。
连接时显示状态;
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
++++++++++++++++++++++++++++css 后代选择器
后代选择器用在标签里卖弄嵌套标签的情况
<html>
<head>
<style type="text/css">
h1 em {color:red;}
</style>
</head>
<body>
<h1>This is a <em>important</em> heading</h1>
<p>This is a <em>important</em> paragraph.</p>
</body>
</html>
效果;
This is a important heading
This is a important paragraph.
---------------------------------------选择器的优先级
网页显示出来都是先显示css自带的默认属性;
这时就会有一个优先级的问题,到底谁先显示,,谁后显示,显示顺序是否和css的属性顺序有关
百度之后才知道星期一龙哥讲的优先级是什么意思;
1,选择器的优先权;
1. 内联样式表的权值最高 1000；
2. ID 选择器的权值为 100
3. Class 类选择器的权值为 10
4. HTML 标签选择器的权值为
权值越低是最先显示的,权值越高表示最后显示的也就是我们看的
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<style type="text/css">
#color_type{color:#ffffff;} 权值100
#color_type p{color:#ffff00;}权值100+1
#color_type .color_type11 span{color:#ff00ff;} 权值100+10+1
</style>
</head>
<body>
<div id="color_type">
<p class="color_type11"> 我在<span> 还好</span></p>
<p>readonly_type_read</p>
</div>
</body>
</html>
选择器定义html的属性,权值越大就显示谁的属性
权值由小到大
元素标签选择器-->类选择器---->id选择器
相关推荐
介绍CSS中，单个选择器，以及复合选择器的权重计算规则，比如： .box #mydiv ul li.txt。通过计算选择器的权重，区别其优先级，判 断最终样式的覆盖效果。
CSS在使用选择器对元素施加属性的时候会有先后顺序,包括特殊性和重要性等概念在内,这里我们就来详解CSS中的选择器优先级顺序,需要的朋友可以参考下
CSS标签选择器优先级.pdf
这个时候突然意识到了CSS选择器的优先级问题，这里就CSS选择器的优先级问题做了一些总结。 51CTO推荐阅读：巧妙地使用CSS选择器 选择器种类 严格来讲，选择器的种类可以分为三种：标签名选择器、类选择器和ID选择...
CSS中选择器优先级顺序实战讲解.pdf
主要介绍了关于CSS选择器优先级的判断并附结果截图，需要的朋友可以参考下
可是，我们经常看到带有元素名称的选择器，例如，在微软的项目模板中就有大量的带有元素名称的选择器，如果没有用的话，为什么要这样写呢？哈哈哈，这么写是有原因的，下面就带大家一起看一下！ CSS Code复制内容到...
java教程超全面javaweb教程28天day2-_06_css的基本选择器的优先级
CSS选择器优先级得关系为： !important>内联>ID选择器>类选择器>标签选择器。 一种优先级算法 内联样式表的权值最高 (style=””) 权值为1000 统计选择符中的ID属性个数。（#id） 权值为100 统计选择符中的CLASS属性...
CSS选择器 xmind - 选择器分类(ID选择器，类选择器，标签选择器，通配选择器，属性选择器，伪类选择器)。 - 选择器关系(分组，后代，子元素，相邻兄弟，后续兄弟)。 - CSS特性(优先级，继承，层叠)。
ID选择器(形如#id{}) 类选择器(形如.class{}) 标签选择器(形如body{}或者*｛｝)，也就是ID选择器，类选择器，标签选择器中，ID选择器的优先级最高，标签选择器最低； 选择器越具体优先级就越高，也就是 ....
通过使用组合器（Combinator）将选择器的描述写得更加精确（参考CSS选择器 – MDN ），例如对于下述代码片段，如果想给.cellphones中的.apple增加样式，只使用.apple，势必会对.fruit中的.apple也造成影响。...
基础选择器：标签选择器、类选择器、id选择器、通配符选择器； 文本字体样式介绍：大小、样式、属性、风格、颜色等； 选择器进阶：复合选择器、并集选择器、交集选择器 、hover伪类选择器； 背景相关属性：颜色、...
css基础选择器有标签选择器、类选择器、id选择器、通用选择器,本文将深入介绍css选择器优先级,这会给正在解决优先级问题的朋友，带来些许帮助
基本样式和选择器（权重优先级）以及复合选择器
主要介绍了CSS属性简写和选择器的优先级问题,是CSS入门学习中的基础知识,需要的朋友可以参考下
主要帮助大家深入理解CSS选择器优先级的相关内容，通过八个小例子分析比较CSS选择器优先级，感兴趣的小伙伴们可以参考一下
伪类选择器CSS伪类（pseudo-class）是加在选择器后面的用来指定元素状态的关键字。 链接相关a:link 未访问的链接a:visited 已访问的链接a:hover 鼠标移动到链接上 a:active 选定的链接 :target 可用于选取当前活动的...