css选择器(1)——元素选择器、类名和id选择器
css的主要优点之一就是它能很容易地向所有同类型的元素应用一组样式。当然它是通过选择器来实现这一点的。
基本规则结构：
语法= 选择器 +声明块
1.元素选择器——直接使用html元素名，指向文档元素
如果想给所有段落都添加缩进的话使用元素选择器是最好的选择
p{
text-indent:2em;
}
2.类选择器和id选择器——独立于文档元素来指定样式
a)类选择器：
给部分段落文本加粗，以及列表的某些项，这时可以使用类选择器来应用样式而不需要像使用元素选择器一样考虑具体涉及的元素，只要事先给要指定样式的元素添加相同的类名即可（给需要指定样式元素的class属性指定相同的值）。
选择器写法："."加上类名
.target{
font-weight:bold;
}
b)多类选择器：
一个元素可以不只有一个类名，class值还可以包含一个词列表，比如：class="first second"；
<style>
/*通过把两个类选择器链接在一起，仅可以选择同时包含这些类名的元素,类名的顺序可以颠倒*/
/*匹配class既有one又有two的段落，第三段和第四段的字体被设置成了粗的*/
p.one.two{
font-weight: bold;
}
</style>
<body>
<p class='one'>one</p>
<p class='two'>two</p>
<p class='one two'>one + two</p>
<p class='one two third'>one + two + third</p>
</body>
c)id选择器：
你可能知道会在一个给定的文档中会有一个ID值为important的元素，但是你不知道这个最重要的东西是一个段落，一个短语，一个列表项还是一个小节标题，你只知道每个文档中都会有这么一个最重要的内容，它可能会出现在任何元素中，且只出现一次，那么这种情况下就可以使用id属性了。
与class属性不同，id属性的一个值仅可以赋给一个元素，如果有一个元素的id值为one，那么该文档中其他元素的id值都不能是one。（实际上浏览器一般不检查html中id属性的唯一性，你设置多个元素有相同的id属性并不会报错）
另外，与class属性不同，id值不能为词列表。如：id='one two'是错的。
选择器写法："#"加上id值。
<style>
#one{
font-weight: bold;
}
</style>
<body>
<p id='one'>利用id选择器来指定样式</p>
</body>
css选择器(1)——元素选择器、类名和id选择器的更多相关文章
- CSS 标签、类名和ID选择器有空格和没有空格的区别
前言 标签选择器.类名选择器以及 ID 选择器在使用上要注意"加空格"和"不加空格".两种使用形式上有很大的差别. 下面是讲解案例的 HTML 代码: < ...
- jQuery-day01-介绍 和 选择器获取元素
1 ,jQuery介绍 1.1,jquery的介绍,javascript库的关系.体验jquery.把js兼容性代码封装在jquery.js中,本身就是一个javascript库. 1.2,jQuer ...
- CSS id 选择器
id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...
- CSS 简介、语法、派生选择器、id 选择器、类选择器、属性选择器
CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现 ...
- CSS中的选择器之类选择器和id选择器
1.css中的选择器: 1.类选择器,又叫class选择器 2.id选择器 3.html元素选择器(又叫标签选择器) 4.通配符选择器 5.伪类选择器 6.组合选择器(多元素选择器,子元素选择器,后代 ...
- [19/06/05-星期三] CSS基础_样式表的位置(内联、内部、外部样式)、块元素(div)、内联元素(span)、常用的选择器
一.概念 CSS(Cascading Style Sheets,层叠样式表) 可以用来为网页创建样式表,通过样式表可以对网页进行装饰. 所谓层叠,就是可以将整个网页想象成是一层一层的结构,层次高的将会 ...
- 类选择器与ID选择器的比较
如果已经在元素中标识了class或id,就可以在选择器中使用这个标准,从而只对已标识的元素进行格式化.不过推荐使用类选择器,一会儿我会解释理由. 要在class选择器和id选择器之间作出选择的时候,建 ...
- css：id选择器的权重>class选择器的权重=属性选择器的权重>元素选择器
最近的项目要自己写前端了,重新学习下前端的一下基本知识. 一般在css样式表中,上面的会被下面的覆盖,如下图,文字会显示蓝色: 所以按照正常的来说,下面的css样式,测试的文字应该还是蓝色 但结果,测 ...
- 请写出css中选择器（元素选择器、类选择器、id选择器）的优先级顺序，和当各种选择器组合时，优先级的计算规则是什么？
id选择器>类选择器>元素选择器 规则:选择器的权重值表述为4个部分,用0,0,0,0表示. 通配符*的权重为0,0,0,0 标签选择器.伪元素选择器的权重为0,0,0,1 类选择器.属性 ...
随机推荐
- Beta版本冲刺第一天！
该作业所属课程:https://edu.cnblogs.com/campus/xnsy/SoftwareEngineeringClass2 作业地址:https://edu.cnblogs.com/c ...
- bzoj 4860 [BeiJing2017]树的难题
题面 https://www.lydsy.com/JudgeOnline/problem.php?id=4860 题解 点分治 设当前重心为v 假设已经把所有边按照出发点第一关键字, 颜色第二关键字排 ...
- 洛谷 P2261 [CQOI2007]余数求和 ||整除(数论)分块
参考:题解 令f(i)=k%i,[p]表示不大于p的最大整数f(i)=k%i=k-[k/i]*i令q=[k/i]f(i)=k-qi如果k/(i+1)=k/i=qf(i+1)=k-q(i+1)=k-qi ...
- dos 下 批量替换 只支持txt
首先必须存成 bat 格式,其次识别不了word 1.bat ##替换12 成12*3 @echo offsetlocal enabledelayedexpansionfor /F "tok ...
- 485 Max Consecutive Ones 最大连续1的个数
给定一个二进制数组, 计算其中最大连续1的个数.示例 1:输入: [1,1,0,1,1,1]输出: 3解释: 开头的两位和最后的三位都是连续1,所以最大连续1的个数是 3.注意: 输入的数组只包 ...
- 使用 Realm 和 Swift 创建 ToDo 应用
原文出处: HOSSAM GHAREEB 译文出处:Prayer’s blog(@EclipsePrayer) 智能手机的快速发展的同时,涌现出了很多对开发者友好的开发工具,这些工具不仅使得开发变 ...
- Asp.net 字符(三)
using System; using System.Collections.Generic; using System.Globalization; using System.Linq; using ...
- 外文翻译 《How we decide》多巴胺的预言 第一节
这是第二章的起始... 书的导言 1991年2月24日凌晨.第一与第二海军陆战队大批向北进入了沙特阿拉伯的沙漠地带,他们从这来进入科威特.这批军队是伊拉克入侵8个月以来,同盟国第一批进入科威特的部队. ...
- AJPFX总结Java 程序初始化过程
觉得Core Java在Java 初始化过程的总体顺序没有讲,只是说了构造器时的顺序,作者似乎认为路径很多,列出来比较混乱.我觉得还是要搞清楚它的过程比较好.所以现在结合我的学习经验写出具体过程: 过 ...
- Dom 获取、Dom动态创建节点
一.Dom获取 1.全称:Document Object Model 文档对象模型 2.我们常用的节点类型 元素(标签)节点.文本节点.属性节点(也就是标签里的属性). 3.docum ...