CSS--伪类中的目标与反选

最新推荐文章于 2024-10-26 14:43:59 发布
原创 最新推荐文章于 2024-10-26 14:43:59 发布 · 641 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文详细介绍了CSS中:target伪类的选择器用法，包括如何使被选中的锚点内容产生高亮显示，以及:not()选择符的使用方法，帮助读者掌握这两种选择器在网页布局中的应用。

目标—:target

:target主要是配合锚点来使用，可以使被选中的锚点内容产生高亮显示
用法是在选择器后面添加 例如要标记<li class="xuan">.....</li>
可以在类选择器后面添加 .xuan:target { color:red }
:target 会自动匹配被选中元素中的id属性

反选—:not()选择符

如果想要否决不使用哪个选择符 就是用:not()
例如想要否决 类 down
:not(.down)
但是他不能否决伪元素以及它自身
.

CSS :not()选择器 (反选伪类)
专注于图像领域，主要研究内容包括计算机视觉和深度学习，特别是在图像分类、目标检测和图像生成等方面有深入的研究和实践经验。
12-15 5960
考虑这样一个场景：假设我们有1个div标签，其内部有h1-h5标签。 < h1 > 我是h1 < h2 > 我是h2 < h3 > 我是h3 < h4 > 我是h4 < h5 > 我是h5
CSS3选择器示例大全(元素选择符、关系选择符、属性选择符、伪类选择符、伪对象选择符)
🏆 前端领域优质创作者
12-12 5003
一、元素选择符(Element Selectors) 其中，常用的选择符有 ID选择符(#name) 和 类选择符(.name)，另两种了解即可。 1. 通配选择符（*） 描述：选定所有对象。 <style> /* 选定页面所有元素(含body/html) */ *{ color:cadetblue; } </style> <h1>title</...
css 选择器 类 反选,必须记住的 30 类 CSS 选择器
weixin_31499265的博客
08-04 1035
开篇有 30 个 CSS 选择器你必须烂熟于心，它们适应于当今各大主流浏览器。1.** {margin: 0;padding: 0;}*选择器选择的是每一个单一元素。很多程序员用上面的 CSS 将所有元素的 margin 和 padding 清零。虽然这是有效的，但最好还是别这么做，这会使得浏览器的负担很重。*选择器也可以用在孩子选择器中。#container * {border: 1px sol...
目标伪类选择器&元素状态伪类
wangming2531的博客
10-11 752
目标伪类选择器： 举例说明一下他的用途，比如点击一个文字或是图标实现跳到顶部，这时候可以用的这个目标伪类选择器 用于匹配当前激活的【锚点元素】 语法： 目标选择器 :target{} new document //点击跳转到我在东北玩泥巴! 跳转至东北 //点击跳转到黏住过客的思念 跳转至江南 //点击跳转到雨到.这里缠成线，点击这个跳转的明显 跳转至上海 我在东北玩泥巴! 黏住过客的思
【css/js】全选和反选。
qq_34365469的博客
03-14 484
一.要实现的效果 1.全选/取消全选 2.反选 二.效果图 三.源码路径: 链接: https://pan.baidu.com/s/1qwrhF1xlmVp1rRqqJ4J0gQ 提取码: 6gh9 这个文件夹下的箭头标识的文件 四.源码 ---------------------------------------------------------------...
CSS选择器
m0_72684019的博客
07-25 800
CSS选择器
对比CSS Selector Generator、unique-selector、dompath这几个库，哪个支持反选、排除功能
03-18
比如，复杂的选择器可能会影响页面渲染速度，或者某些旧浏览器不支持较新的CSS伪类。因此，在选择库时，不仅要看功能支持，还要考虑实际应用环境。根据对CSS Selector Generator、unique-selector和dompath三个库的...
基于CSS3的复选框与单选按钮动画美化特效
因此，开发者借助CSS3中的过渡（transition）、变换（transform）、关键帧动画（@keyframes）、伪类选择器（如:checked、:before、:after）以及自定义标签结构等技术手段，重新构建了这些基础控件的外观表现形式，并...
jQuery实现复选框全选反选及获取选中值
本文将围绕标题“checkbox使用jquery全选-反选-取得选中的值”所涉及的知识点进行深入剖析，并结合描述和标签内容，系统性地讲解其背后的原理、实现方式及实际应用技巧。 首先，“全选”功能指的是用户点击一个...
CssSelectorGenerator支持反选或者排除吗
03-18
我记得CSS Level 4引入了:not()伪类，可以排除特定元素。比如:not(.class)排除有某个类的元素。不过，这可能取决于浏览器支持情况，但现代浏览器应该支持基本的:not()用法。那CssSelectorGenerator是否利用了这个...
css、jquery智能反选
02-28
jquery实现全选、智能反选以及css样式的一个html代码文件
html css 全选 反选
phperHe
08-23 1994
处理批量操作 全选 反选 1、展示的页面 （示例用的是前端bootstrap table中的才是核心部分） &amp;lt;div class=&quot;row&quot;&amp;gt; &amp;lt;div class=&quot;col-md-12&quot;&amp;gt; &amp;lt;div class=&quot;panel panel-primary&quot;&a
CSS选择器：第一个、最后一个、单双、奇偶、第n个、反选，nth-child，last-child，first-child
weixin_44303625的博客
10-26 6156
选择器用法: 选择属于其父元素的最后一个子元素。示例结合这些选择器，你可以灵活地为网页中的元素添加样式。确保在HTML结构中使用这些选择器时，理解它们的行为，以便达到预期效果。
CSS3+JS实现的个性化全选反选
sennyla的博客
01-23 728
监控所有列表项下的checkbox是否都处在选中的状态，如果全选中则全选按钮处在选中状态；当存在checkbox未选中时，取消全选按钮的选中状态。   window.onload = function(){ selectAll(); doCheckbox(); } function Id(id){ return document.getElementById(id
css 一键全选与反选
噗嗤
06-03 558
css 一键全选与反选 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>一键全选和不选</title> </head> <body> <button value="全选" id="clear" onclick="odd()">全选</button> <button value="反选" id
CSS —— 选择器
七月
09-28 5882
CSS选择器笔记（阮一峰）： 1、基础选择器 2、复合选择器 目的是为了选择更准确更精细的目标元素标签。 复合选择器就是由两个或者多个基础选择器，通过不同方式组合而成的。 3、CSS选择器的三大特性： 1）层叠性（即后浪推前浪） 相同选择器相同属性设置相同样式，此时一个样式会覆盖另一个样式。 样式冲突遵循的是就近原则。 样式不冲突则不会层叠 2）继承性（即子承父业） 子标签会继承父级的某些样式，如文本颜色、字体等 以text-、font-、line-开头的元素以及color属性等都可
css 选择器
lesblueleaves的专栏
09-30 319
读书笔记，稍后整理~~ #main p: This expression finds an element with an ID of main, all element descendants, and then all element descendants.
低碳生产汽车多阶段研讨会中的混合模型调度序列优化.zip
最新发布
12-03
1.版本：matlab2014a/2019b/2024b 2.附赠案例数据可直接运行。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值