pseudo-class相关内容

与样式化组件一起使用的前后伪类

将:before和:after伪类应用于样式化组件的正确方式是什么？ 我知道您可以使用 &:hover {} 将:hover伪类应用于样式化组件。 这是否适用于所有伪元素，如之前和之后？ 我曾尝试将&:before和&:after策略用于一些相当复杂的示例，我不确定我的尝试不起作用是因为我的示例有问题，还是因为它不像那样工作。 有人对此有什么见解吗？谢谢。 c ..
发布时间：2022-04-15 10:22:32 其他开发

在 CSS 中使用 HTML 在标记后的悬停状态

我目前正在尝试将一些 html 传递到 css 中的 :after 伪类中，以便在链接悬停后添加一个箭头.我已经在很久以前在默认安装附带的库存 WordPress 主题中看到了这一点.我觉得我必须错过一些简单的东西. a:hover:after{content: "»"} 提前致谢！ 解决方案 需要使用十六进制值\00BB. http://jsfiddle.net/d ..
发布时间：2022-01-22 22:58:00 前端开发

css伪类:悬停不工作

我正在努力让一个最简单的 css hover 伪类工作.任何人都知道为什么以下不起作用? CSS #hidden {display:none;}#show:hover #hidden{display:block;} html show 我在这里 我真的觉得问这么简单的问题很愚蠢，我这样做了 ..
发布时间：2022-01-22 22:44:17 前端开发

用于离开悬停的 CSS 伪类

我的网站上有一个不错的小悬停效果，当用户悬停在链接上时，它会快速过渡.但是当用户将鼠标悬停在盒子上时，阴影(和其他特征)会立即消失，而不是淡出.有没有办法让属性同时淡入和淡出，也许使用某种 :un-hover 类型的伪类?谢谢！如果有帮助，这里是 CSS 块: a.squares:hover, a.squares:active {颜色:黑色;背景颜色:#E8E8E8；盒子阴影:0 0 12px ..
发布时间：2022-01-22 22:37:19 前端开发

如何使用 firebug 检查 CSS 伪类?

我正在为我无法覆盖的不情愿的 a:hover css 样式而苦苦挣扎. 我试图检查 Firebug 中的元素，但我不明白为什么它不起作用.我什至看不到如何在 Firebug 中正确检查 a:hover css 事件. 我见过: Firebug 中的悬停检查 http://blog.borngeek.com/2010/04/16/hover-inspection-in-firebug/ ..
发布时间：2022-01-22 22:33:10 前端开发

CSS3 :hover 和 :focus 的区别?

CSS3 文档 谈到 :hover 和 :focus ，这对我来说似乎完全一样.两者有什么区别?我没看到什么? 谢谢！ 解决方案 当鼠标指针悬停在元素上时，悬停为“真".如果光标在该元素中，则焦点为真.悬停可能为假而焦点为真(例如单击文本字段然后将鼠标移开) ..
发布时间：2022-01-22 22:32:16 前端开发

使 css :hover 只影响父元素

在css中，当子事件悬停时，如何停止在父元素中触发 :hover 事件，以便仅在父元素本身悬停时触发?在这种情况下，我的子元素实际上以绝对定位定位在其父元素之外，因此当子元素悬停时父元素发生变化时，这有点奇怪. 我做了一个JSFiddle来说明问题. 这是我的示例所用解决方案的 JSFiddle. 解决方案 有一个纯 css 解决方案(实际上甚至有两个)，但都是有代价的. ..
发布时间：2022-01-22 22:20:06 前端开发

CSS3:未经检查的伪类

我知道有一个官方的 CSS3 :checked 伪类，但是有没有一个 :unchecked 伪类，它们有相同的浏览器支持吗? Sitepoint 的参考资料 没有提到，但是这个 whatwg 规范(不管是什么)的作用. 我知道将 :checked 和 :not() 伪类结合起来可以达到相同的结果，但我还是很好奇: input[type="checkbox"]:not(:checked ..
发布时间：2022-01-10 08:28:34 前端开发

Css 伪类 input:not(disabled)not:[type="submit"]:focus

我想为输入元素应用一些 css，并且我只想对未禁用且非提交类型的输入执行此操作，下面的 css 不起作用，也许如果有人可以解释我必须如何添加它. input:not(disabled)not:[type="submit"]:focus{盒子阴影:0 0 2px 0 #0066FF;-webkit-box-shadow:0 0 4px 0 #66A3FF;} 解决方案 代替: input:n ..
发布时间：2022-01-10 08:27:50 前端开发

:after 与 ::after

CSS 2.1 :after 和 CSS 3 ::after 伪选择器(除了 ::after 旧版浏览器不支持)?是否有任何实际理由使用新规范? 解决方案 这是伪类 vs 伪元素的区别. ::first-line、::first-letter、::before 和 ::after 除外code>(已经存在了一段时间，如果您需要 IE8 支持，可以与单冒号一起使用)，伪元素 需要双冒号 ..
发布时间：2022-01-10 08:27:06 前端开发

当浏览器不支持 CSS 伪类时会发生什么?

如果浏览器不支持 CSS 伪类(如 :dir)会怎样? 例如: html:dir(rtl) {红色;} 如果浏览器不理解 :dir 伪类，他们会忽略这条规则吗?我对一般情况比对这个特定的伪类更感兴趣.我的直觉告诉我是的，但我还没有找到证实我的直觉的文档. 这个问题与这个问题不同:无效的 CSS 选择器导致规则被丢弃:原因是什么?.它更窄，我问的是浏览器在看到它无法识别的伪类时会做什 ..
发布时间：2022-01-10 08:25:23 前端开发

为什么叫伪类?

a:hover 为什么叫“伪类"? 与“类"的概念有什么相似之处吗? 解决方案 在 CSS 术语中，类是一个以句号开头的选择器，例如 .foo { ... } 它会以表格形式使用 “类"的这种用法更多是指“具有共同特征并通过种类或质量与其他事物区分开来的一组或类别的事物"，而不是借用面向对象的术语. 伪类“不是一个真正的类"，因为用 ..
发布时间：2022-01-10 08:23:45 前端开发

被 CSS 伪类 :active 搞糊涂了

我在 这里查看 CSS :active Selector. :active 选择器样式链接到活跃页面 这让我想到，HTML/CSS 术语中的“活动页面"到底是什么... 此时我去了 w3docs 第 5.11.3 节动态伪类::hover、:active 和 :focus. :active 伪类适用于一个元素被激活用户.例如，在时间之间用户按下鼠标按钮并释放它. 所以 ..
发布时间：2022-01-10 08:23:36 前端开发

在 li 或除 a、input、button 等之外的其他元素上使用 :focus 伪类

是否可以选择一个有焦点的元素，如 a:focus 或 input:focus，但在另一个元素上，如 div、li、span 或其他? 如果不可能，如何用标签代替?我正在尝试修改 li 元素在聚焦时的高度，尝试使用 a，但高度不会改变. 请求的信息: “你能不能解释一下你是如何把注意力放在李身上的?" 通过 CSS 选择器 li:focus.请参阅 https://jsfid ..
发布时间：2022-01-10 08:23:26 前端开发

CSS 和 Internet Explorer 中的 :last-child 伪类选择器

我有以下代码: ul.myList li{右边框:1px 虚线 #000;} 但是，在最后一个元素上，我需要删除该边框，因为我正在使用的设计表明最后一项不需要边框作为分隔符. 所以，我需要定位列表的最后一个子元素，因此在我的 CSS 中添加了 ul.myList li:last-child{右边界:无；} 众所周知，它在 Firefox、Safari 和 Chrome 中运行良好. ..
发布时间：2022-01-10 08:20:40 前端开发