1. css基本选择器
p {color: red;font-size: 20px;}
选择器 {声明(属性: 值);声明(属性: 值);}
1) css标记选择器
<p>爱编程！爱Java</p>
p{color: red;font-size: 20px;}
2) css类别选择器
<p class="r">爱编程！爱Java</p>
.r{color: red;font-size: 20px;}
3) cssID选择器
<p id="p1">爱编程！爱Java</p>
#p1{color: red;font-size: 20px;}
2. 在html中引入css的方法
1) 行内样式
<p style="color: red;font-size: 20px;">行内样式</p>
2) 内嵌式
<style type="text/css">
p{color: red;font-size: 20px;}
</style>
3) 链接式(使用哪个导入哪个)
<link href="red.css" type="text/css" rel="stylesheet">
red.css
{color: red;font-size: 20px;}
4) 导入样式(全部导入)
<style type="text/css">
@import url(yellow.css)
</style>
3. 几种方式的优先级比较
后面的样式会覆盖前面的样式
行内样式 > 内嵌式 > 链接式 > 导入样式 (链接式在前面)
行内样式 > 链接式 > 内嵌式 > 导入样式 (链接式在后面)
<title>优先级比较</title>
<link href="red.css" type="text/css" rel="stylesheet">
<style type="text/css">
p{
color: blue;
font-size: 20px;
}
@import url(yellow.css);
</style>
</head>
<body>
<p>行内样式 >链接式>内嵌式>导入式(链接式在后面)<br/>
行内样式 >内嵌式>导入式>链接式(链接式在前面)<br/>
总的规律：后面的样式会覆盖前面的样式
</p>
</body>
red.css
p{color: red;font-size: 20px;}
yellow.css
p{color: yellow;font-size: 20px;}
分享到：
相关推荐
在CSS中，有多种选择器可以用来指定样式规则，每种选择器都有其自己的优先级。以下是常见的选择器和它们的优先级： 1. !important：高于所有其他选择器的优先级 2. ID选择器 (#ID)：高于类选择器和元素选择器的...
**CSS选择器特殊性分析** 在CSS样式表中，选择器是用于指定元素样式的关键工具。它们决定了哪些规则将应用于页面上的特定元素。选择器的特殊性（Specificity）是CSS优先级的一种度量，用于解决当多个选择器同时影响...
声明在样式表或文档中越靠后出现，权重越大。如果样式表中有通过 @import 导入的样式表，一般认为出现在导入样式表中的声明在前，主样式表的所有声明在后。
CSS 优先级包括位置优先级和选择器优先级。位置优先级是指行内样式的优先级高于内部样式，而内部样式的优先级高于外部样式。选择器优先级是指 ID 选择器的优先级高于 class 选择器，而 class 选择器的优先级高于元素...
特异性是指CSS选择器的优先级。一个更具体的样式规则通常会被认为比一个更通用的规则具有更高的优先级。具体来说： - 内联样式（例如`<div style="color:red">`）拥有较高的特异性。 - ID选择器（如`#example`）...
本章任务是了解CSS样式在页面中的引入、使用CSS选择器为网页元素添加CSS样式、掌握CSS的字体样式、文本样式及超链接样式。 CSS概念及应用 CSS的概念：Cascading Style Sheet，级联样式表，用于表现HTML或XHTML文件...
3. **选择器生成**：通过拖拽或点击元素，编辑器可以自动生成对应的选择器，帮助开发者快速定位并修改元素样式。 4. **调试工具**：内置的CSS调试功能可以帮助用户查找并解决样式冲突问题，理解样式层叠和优先级。 ...
- **选择器特殊性**：CSS选择器的特殊性决定了其优先级。选择器特殊性由四个部分组成，分别代表ID选择器、类选择器、属性选择器和元素选择器的数量。例如，`#myId .myClass`的特殊性为1,1,0,0，而`.myClass`的特殊...
6. **08-css基本选择器的优先级.html**：CSS选择器的优先级是一个重要的概念，它决定了当多个选择器同时作用于同一元素时，哪个样式会生效。优先级由选择器的类型决定，ID选择器最高，类选择器次之，标签选择器再次...
CSS中的选择器冲突遵循一个特定的优先级顺序：id选择器高于class选择器，class选择器高于标签选择器。即id选择器具有最高的优先级。 CSS的四种使用方式包括： 1. 行内样式（Inline Style）：直接在HTML元素的style...
需要注意的是，CSS的层叠规则决定了样式优先级，后定义的样式会覆盖前面的同标记样式，而在选择器的优先级中，ID选择器高于class选择器，class选择器高于HTML选择器。 选择器是CSS的核心，主要有HTML选择器（标签...
常见的CSS属性和选择器** - **选择器**：如类选择器（`.class`）、ID选择器（`#id`）、元素选择器（`element`）等。 - **属性**：包括颜色（`color`）、背景（`background`）、字体（`font`）、边框（`border`）、...
五、CSS选择器 ### 4.1 基本选择器 包括元素选择器、id选择器、class选择器。 ### 4.2 属性选择器 根据属性值来选择元素。 六、结语 CSS是前端开发的基础技术，本文档为读者提供了系统的CSS基础知识，希望读者...
1. **CSS选择器生成**：帮助用户生成复杂的选择器，如后代选择器、伪类和伪元素。 2. **CSS3特性支持**：包括过渡、动画、阴影、渐变、Flexbox和Grid布局等现代CSS特性。 3. **单位转换**：自动转换像素到百分比，...
- **CSS优先级**：CSS选择器的优先级决定了样式如何覆盖。ID选择器的优先级高于类选择器，行内样式（如`style="..."`）优先级最高，后定义的样式会覆盖前定义的，指定的样式优于继承的样式。 - **盒模型**：CSS盒...
1.2.3 链接式 1.2.4 导入样式 1.2.5 各种方式的优先级问题 1.3 体验CSS 1.3.1 从零开始 1.3.2 加入CSS控制 1.3.3 控制图片 1.3.4 CSS的注释 第2章 CSS的基本语法 2.1 CSS选择器 2.1.1 标记选择...
层叠根据规则的优先级来决定，优先级包括选择器的特异性、权重、继承和顺序。继承是CSS的一大特点，允许子元素继承父元素的一些样式属性，如字体、颜色等。 2. **选择器**：CSS2.0提供了多种选择器，包括元素选择器...
**CSS的选择器** - **标记选择器**：根据HTML标记（如`<p>`、`<h1>`）来选择元素。 - **类别选择器**：使用`.class`来选择具有特定类名的元素。 - **ID选择器**：使用`#id`来选择具有特定ID的唯一元素。ID在文档中...
4. **通配符选择器（*）、类型选择器（如div）、类选择器（.class）和ID选择器（#id）**的优先级依次递增，ID选择器的优先级最高。 5. 如果选择器的优先级相同，样式定义在文档中出现的位置越靠后，优先级越高，即后...
2. **选择器优先级**：理解CSS选择器的优先级是关键。内联样式（内嵌样式）优先级最高，接着是ID选择器，然后是类选择器、属性选择器和元素选择器。同优先级的选择器，靠后的会覆盖靠前的。 3. **盒模型**：理解CSS...