一、初级选择器 1.1 基础选择器 通配符(*)选择器 语法:*{属性:属性值;} 说明:*表示页面中所有的元素(标签),我们常用来重置样式。实例:*{ margin: 0;padding: 0;} 标签(元素)选择器 语法:标签名{属性:属性值;} 说明:标签选择器就是使用结构中元素名称直接作为选择符。实例:div{ width: 10...
CSS选择器十二种方法 相信大家对元素应该是不陌生的,当我们页面中,我们想要布局,给元素添加样式的时候,我们应该怎么获取到指定元素呢? 优先级:ID 选择器 > 类选择器 > 标签选择器 > 通配符 1.元素选择器 通过标签名可直接选取到元素 例如:div{},p{},ul{}等等 2.类选择器 通过class类选取到元素,可以选取到...
其他伪类 除了上面提到的伪类,CSS中还包含以下伪类: :root:选择文档中最高级别的父元素,通常是HTML文档中的 元素。可用于定义对所有页面元素可用的CSS变量。 :is:匹配可以是多个选择器之一的元素,使得长的选择器列表更加简短和易读。例如,:is(h1, h2, h3) 会匹配这三个标题元素之一。 :where:与 :is 类似,...
除了上面提到的伪类,CSS中还包含以下伪类: :root:选择文档中最高级别的父元素,通常是HTML文档中的 元素。可用于定义对所有页面元素可用的CSS变量。 :is:匹配可以是多个选择器之一的元素,使得长的选择器列表更加简短和易读。例如,:is(h1, h2, h3) 会匹配这三个标题元素之一。 :where:与 :is 类似,但允许根据...
什么是选择器 选择页面上的某一个或某一类元素。因为自从CSS2.0后,提出来将HTML和CSS分离的思想。因为将标签和样式分开后,标签和样式失去了对应关系,导致样式和标签不匹配,所以用到了选择器,选择器就是给标签起来个名字,样式通过名字对应指定的标签。三大选择器 标签选择器 标签选择器会选择页面上所有的这个...
// HTML// CSS*{// declarations} 三个元素都会被选中。属性选择器 1.[attr][attr] 选择器匹配所有包含 attr 属性的元素:// HTML// CSS[display]{// declarations} 元素会被选中。2.[attr="value"][attr="value"] 选择器会匹配所有 attr 属性值为 value 的元素:// HTML// CSS[display="inline...
常见的 CSS 选择器 下是一些常见的 CSS 选择器: 元素选择器(Element Selector):通过元素名称选择 HTML 元素。 如下代码,p选择器将选择所有元素: p{color:blue;} 类选择器(Class Selector):通过类别名称选择具有特定类别的 HTML 元素。 类选择器以.开头,后面跟着类别名称。 如下代码...
属性选择器在css2中引入,可以根据元素的属性选择元素。 简单属性选择器 简单的属性选择器可以使我们根据一个元素是否包含某个属性来做出选择。 必须所有带有alt属性的img元素或者所有含有data-custom属性的元素,可以是使用以下css img[alt]{width:50vw;height:50vh; ...
CSS(层叠样式表)是网页样式设计的核心技术之一,通过选择器,我们可以精准定位并施加样式于HTML文档中的各个元素。本文将详细介绍CSS中的一些常见选择器,并配以实例代码进行演示。 1. 基本选择器 1.1 标签选择器 标签选择器是最基础的选择器,通过HTML标签名称选取相应的元素。
1.3 CSS 的三大特性 Css有三个非常重要的特性:层叠性、继承性、优先级。层叠性 相同选择器给设置相同的样式,此时一个样式就会覆盖(层叠)另一个冲突的样式。层叠性主要解决样式冲突的问题。层叠性原则:样式冲突,遵循的原则是就近原则,哪个样式离结构近,就执行哪个样式样式不冲突,不会层叠 继承性 CSS中的...