首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

【CSS】CSS 选择器 ① ( CSS 选择器作用 | CSS 选择器分类 | 标签选择器 | 选择器 | div 与 span 标签 | 多选择器 )

文章目录 一、CSS 选择器作用 二、CSS 选择器分类 三、标签选择器 1、简介 2、代码示例 四、选择器 1、简介 2、名规范 3、代码示例 4、div 与 span 标签 ① span...选择器分类 ---- CSS 选择器 主要分为 : 基础选择器 复合选择器 两种类型 ; CSS 基础选择器 主要分为以下几类 : 标签选择器 选择器 id 选择器 通配符选择器 三、标签选择器 --...1、简介 CSS 选择器 可以 将 页面中的 某几个 标签选择出来 , 使用 " .名 " 识别标签 ; CSS 选择器 使用方式如下 : 首先 , 在标签中的 class 属性中设置名 ;...标签内容 然后 , 在 CSS 中使用 " .名 " 作为 选择器 , 选出设置指定名的标签 ; .name { color: blue;...font-size:20px; } CSS 选择器 优点 : 可以选择指定的若干标签 ; 2、名规范 名规范 : 多个单词组成的名 , 推荐使用 - 隔开 ; 不要使用 纯数字 ,

2.8K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    如何使用CSS伪选择器

    document.querySelectorAll()[4]返回所有匹配的HTML元素,这些元素位于数组NodeList[5]中。 伪选择器根据HTML元素的当前状态来定位它们。...如果一个元素能够被激活(如选择、点击或接受文本输入),或者能够获取焦点,则该元素是启用的 :disabled:匹配一个被禁用的输入框。...在被禁用时,元素不能被激活或获取焦点 :required:指向必填的输入框。...… :is伪选择器 注意:这最初被指定为:matches()和:any(),但:is()已经成为CSS标准。...MDN解释::is()CSS伪函数将选择器列表作为参数,并选择该列表中任意一个选择器可以选择的元素。这对于以更紧凑的形式编写大型选择器非常有用。 你经常需要在不止一个元素上面应用相同的样式。

    2.2K40

    CSS3选择器–结构性伪选择器

    在学习结构性伪选择器之前,先了解2个概念:CSS中的伪选择器和伪元素: 1、伪选择器:CSS中已经定义好的选择器,不能随便取名 常用的伪选择器是使用在a元素上的几种...:伪元素{样式} 在后续的文章中会详细介绍伪选择器的具体使用方法,本文主要是要介绍nth-child、nth-last-child、nth-of-type、nth-last-of-type...结构性伪选择器的公共特征是允许开发者根据文档结构来指定元素的样式。接下来开始进入正题。...其他几种结构性伪选择器这里就不做详细介绍了。这里主要是对比三种选择器。...总结: 为了方便记忆和查询,把CSS的结构伪选择器归为四: 1)通用子元素过滤器:E:nth-child(n)(顺序过滤)和E:nth-last-child(n)(逆序过滤

    53210

    获取request,获取response,获取session,获取ServletRequestAttributes,的工具

    目录 1 需求 2 工具 1 需求 我们写一个springboot项目,写一个接口,接口没有参数,但是我们想要 获取获取request,获取response,获取session,获取ServletRequestAttributes...,将字符串渲染到客户端,判断接口是否是Ajax异步请求,内容编码,解码 我们可以使用工具,拿到随便一个项目都可以使用 2 工具 import java.io.IOException; import...org.springframework.web.context.request.RequestContextHolder; import org.springframework.web.context.request.ServletRequestAttributes; /** * 客户端工具...* 就是在其他的页面,你接口参数里面没有 request ,reponse * 你可以使用这个工具获取到 * @author ruoyi */ public class ServletUtils...{ /** * 获取String参数 */ public static String getParameter(String name) {

    2.1K10

    第91天:CSS3 属性选择器、伪选择器和伪元素选择器

    一、属性选择器 其特点是通过属性来选择元素,具体有以下5种形式: 1、E[attr] 表示存在attr属性即可; div[class] 2、E[attr=val] 表示属性值完全等于val; div...val字符并且在“开始”位置; div[class^=mydemo] 5、E[attr$=val] 表示的属性值里包含val字符并且在“结束”位置;   div[class$=demos] 二、伪选择器...除了以前学过的:link、:active、:visited、:hover,CSS3又新增了其它的伪选择器。...1、以某元素相对于其父元素或兄弟元素的位置来获取无素的结构伪。 重点理解通过E来确定元素的父元素。...四、伪元素选择器 重点:E::before、E::after 是一个行内元素,需要转换成块元素 E:after、E:before 在旧版本里是伪,在新版本里是伪元素,新版本下E:after、E:before

    1.6K30

    CSS魔法堂:稍稍深入伪选择器

    前言  过去零零星星地了解和使用:link、::after和content等伪、伪元素选择器,最近看书时发现这方面有所欠缺,于是决定稍微深入学习一下,以下为伪部分的整理。...伪  伪选择器实质上是让设计师可以根据元素特定的状态,设置不同的视觉效果。...想必各位都和我一样,最初接触到的就是上述4个伪了吧?!而且还死机硬背它们的设置顺序(LVAH)吧,哈哈。 设置当前目标元素样式  还记得URL中的井号吗?...也就是符合以下选择器的元素均支持focus状态。...JS获取当前得到焦点的元素 /* * 加载完成时默认返回body * 若某元素获得焦点时,则返回该元素 */ document.activeElement :: HTMLElement 另外还有一个让人误会的属性

    1K20

    【说站】CSS伪选择器是什么

    CSS伪选择器是什么 1、伪选择器,同一个标签,根据其不同的种状态,有不同的样式。这就叫做“伪”。伪用冒号来表示。 比如div是属于box,这一点很明确,就是属于box。...但是a属于什么?不明确。因为需要看用户点击前是什么状态,点击后是什么状态。所以,就叫做“伪”。 2、伪选择器分为两种,静态伪和动态伪。 (1)静态伪:只能用于超链接的样式。...(2)动态伪:针对所有标签都适用的样式。如下: :hover “悬停”:鼠标放到标签上的时候 :active “激活”: 鼠标点击标签,但是不松手时。...:focus 是某个标签获得焦点时的样式(比如某个输入框获得焦点) 以上就是CSS伪选择器的介绍,希望对大家有所帮助。

    52820

    【CSS】伪元素和伪选择器区别

    1.伪选择器和伪元素选择器选择器是用来向某些选择器来添加效果。...(空格) :not(标签名) (3)目标伪选择器: :target (4)UI元素状态选择器: :enabled :disabled :checked (5)动态伪选择器: :link...:visited :hover :active (6)用户行为伪选择器 :focus 伪元素选择器则是用来将特殊的效果添加在选择器上。...:伪不修改DOM容,通过一些特定的选择器根据特定的状态,特定条件来修改元素的样;而伪元素可能改变DOM结构,创造了虚拟的DOM 伪选择器只是相当于给标签加上了个名字,让我们能够找到精准的位置,而伪元素选择器修改了他原本的结构...2.注意 可通过使用css伪实现点击元素变色的效果,两个伪是:active, :focus :active :active选择器用于选择活动链接。

    1.6K10
    领券