选择器优先级
标签选择器(div) < 类选择器(class="content") < id选择器(id="unique") < style属性
标签选择器:
div {
color: red;
}
类选择器:
.content {
color: green;
}
id选择器:
#unique {
color: black;
}
style属性:
<div style="key1:value1; key2:value2">xyz</div>
扩展选择器
关联选择器
如,只对p标签中的b标签进行设置
<p>xxxxzzzyyyyy</p><p>xxxx<b>zzz</b>yyyyy</p>
p b {
background-color: blue;
color: #FFF;
}
组合选择器
对不同选择器进行相同样式的设置
如,对类选择器和标签选择器同时进行设置
<div class="c1">xxxx</div>
<div>abc<b>eee<b>fgh</div>
.c1,div b {
background-color: blue;
color: #FFF;
}
伪元素选择器
预定义好的一系列css样式,在某个特定的时候由浏览器自动切换效果
如,a标签具有:
a:link
a:visited
a:hover
a:active
link--->提供超链接标识
取消超链接的下划线
a:link {
text-decoration: none;
}
hover--->对div使用悬停效果:
div:hover {
color: white;
}
focus--->对具有焦点的元素进行属性设置
input:focus {
background-color:blue;
text-decoration: underline;
}
相关推荐
CSS基础-派生选择器,CSS入门必备资料
本压缩包“day03(CSS01-基础选择器+字体文本样式).rar”显然是一个关于CSS学习资源的集合,主要涵盖了基础选择器和字体文本样式的概念与应用。下面我们将深入探讨这两个关键知识点。 **一、基础选择器** 1. **...
【CSS基础-梦之都教学】是为初学者设计的一套教程,旨在让学习者能够轻松掌握CSS的基础知识。CSS,即层叠样式表(Cascading Style Sheets),是一种用于定义HTML或XML(包括SVG、MathML等各种XML方言)文档呈现方式...
CSS选择器是其核心,可以按照元素名、类、ID或其他属性来选择要应用样式的HTML元素。基本的CSS样式包括颜色、字体、尺寸、位置等,例如: ```css body { font-family: Arial, sans-serif; background-color: #f0...
CSS基础选择器进阶: 在CSS中,选择器是用于选择HTML元素并应用样式的核心机制。选择器进阶是指在基础选择器的基础上,进一步学习和应用选择器的高级规则和语法。 1. 复合选择器: 复合选择器是指使用空格将多个...
在这个练习中,你将从最基础的标签选择器开始,如`<p>`、`<div>`等,逐渐接触更复杂的类选择器、ID选择器、属性选择器,以及后代选择器、相邻兄弟选择器等。这些选择器的组合使用能实现更精细的控制,让你对CSS有更...
#### 二、CSS基础选择器 - **2.1 元素选择器(标签选择器)** 元素选择器允许开发者根据HTML标签名称来指定统一的样式。这种选择器简单直接,能够快速为页面中的所有同类标签设置相同的样式。例如,`p { color: ...
本资源摘要信息涵盖了CSS基础知识点,包括基础认知、基础选择器、字体和文本样式、Chrome调试工具、综合案例等方面的知识点。 一、基础认知 * CSS的介绍:层叠样式表(Cascading style sheets) * CSS的作用:给...
1. **CSS基础**:CSS是由一系列选择器和声明组成的,选择器定位HTML或XML元素,而声明定义了这些元素的样式属性。例如,`p {color: red;}`会选择所有的段落元素并将其文字颜色设置为红色。 2. **CSS选择器**:选择...
本教程将聚焦于CSS的基础选择器,这是学习CSS的第一步,对于构建美观、响应式的网页至关重要。通过理解并熟练运用这些选择器,开发者能够精准地定位到网页中的各个元素,为其设置样式。 一、通用选择器 通用选择器 ...
* 优先级公式:继承 通配符选择器 标签选择器 类选择器 选择器 行内样式 !important * 注意点:!important 写在属性值的后面,分号的前面!不能提升继承的优先级,只要是继承优先级最低! PxCook 的基本使用 ...
CSS3新增了更多的选择器、过渡效果、动画、多列布局、Flexbox和Grid布局等,大大增强了网页设计的灵活性。 在"company"这个项目中,初学者可能需要结合JSP处理动态数据,如从数据库获取信息,并用HTML来构建页面的...
html----HTML+CSS基础教程(课件PPT版)----介绍HTML和CSS的基础知识。学习HTML基础语法、标签、CSS基础语法和选择器,以及它们的基本用法。
同时,开发者会用CSS来控制这些动态生成的内容的外观,比如使用类选择器来改变特定元素的样式,或者使用媒体查询来实现响应式设计。 在实际项目中,JSP常常与Servlets一起使用,Servlets负责处理HTTP请求,而JSP则...
【CSS Sprite Loader】是前端开发中的一个重要工具,它是一个基于Webpack的加载器,主要用于处理CSS中的背景图片。在Web性能优化中,CSS Sprite技术是一种常见的方法,它将多个小图合并成一张大图(通常称为sprite...
4. **CSS基础知识** - **概念和特点**:CSS是层叠样式表,用于控制网页样式,提供了诸如字体、颜色、背景等丰富的格式化功能。 - **使用方式**:CSS可以通过内联样式、内部样式表和外部样式表等方式引入到HTML中。...
基础的选择器如元素选择器、类选择器和ID选择器是CSS的基础,但CSS还提供了更复杂的结构选择器和伪类/伪元素选择器。结构选择器包括子代选择器(`>`)、相邻兄弟选择器(`+`)和后续兄弟选择器(`~`),它们允许我们...
选择器是CSS的核心之一,分为基础选择器和复杂选择器。基础选择器包括标签选择器、类选择器和ID选择器。标签选择器按HTML标签应用样式,类选择器以"."前缀,通过HTML的class属性调用,ID选择器以 "#" 前缀,对应HTML...
CSS的基本结构由选择器和声明组成。选择器指向我们想要应用样式的元素,而声明则定义了这些元素的样式属性和值。例如: ``` p { color: red; font-size: 16px; } ``` 在这个例子中,`p`是选择器,表示所有段落元素...