如何操作第一个先前的psuedo元素类属性

本文介绍了如何操作第一个先前的psuedo元素类属性的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 < ul > < li class = 标题hvr -underline-left-left > 1 < / li > < li class = hvr-icon-forward > 2 < / li > < li class = hvr-icon-forward > ; 3 < / li > < li class = 标题hvr-underline-from -left > 4 < / li > < li class = hvr-icon-forward > 5 < / li > < li class = hvr-icon-forward > 6 < / li > < / ul > ; 鼠标悬停（$（li.hvr-icon-forward）。悬停）我可以改变第一个元素的颜色（class = .hvr-underline-from-left）位于class = hvr-icon-forward $（ li.hvr-icon-forward）。悬停（ function （）{$（ this ）。prevAll（ li.hvr-underline-from-left：first）。css（' color '，' ＃006cb4'）}， function （）{$（ this ）。prevAll（ li.hvr-underline-from-left：first）。css（' color'，' black'）} ）; }）; 但是如何更改第一个元素的psuedo元素的css属性，它位于class = hvr-icon-forward $ b $之上b 。 hvr-underline-from-left { display ： inline-block; vertical-对齐 ： middle; -webkit-transform ： translateZ（0）; transform ： translateZ（0）; box-shadow ： 0 0 1px rgba（0,0， 0,0）; - webkit-backface-visibil ity ： 隐藏; 背面可见性 ： 隐藏; -moz-osx-font-smoothing ： 灰度; position ： relative; overflow ： hidden; } 。 hvr-underline-from-left：before { content ： ; position ： 绝对值; z-index ： -1; left ： 0; 正确 ： 100％; bottom ： 0; background ： ＃2098d1; height ： 4px; - webkit-transition-property ： right; transition-property ： right; - webkit-transition-duration ： 0.3s; transition-duration ： 0.3s; - webkit-transition-timing-function ： 缓出; transition-timing-function ： 缓出; } 我想改变财产（右：0;从右边：100％;）在上面的鼠标悬停逻辑解决方案 （li.hvr中的伪元素类（.hvr-underline-from-left：before）中-icon-forward）。悬停）我能够改变第一个元素的颜色（class = .hvr-underline-from-left），它位于class = hvr-icon-forward 之上 （ li.hvr-icon-forward）。悬停（ function （）{ （ this ）。prevAll（ li.hvr -underline-left-left：first）。css（' color'，' ＃006cb4'）}， function （）{ <ul><li class="heading hvr-underline-from-left">1</li><li class="hvr-icon-forward">2</li><li class="hvr-icon-forward">3</li><li class="heading hvr-underline-from-left">4</li><li class="hvr-icon-forward">5</li><li class="hvr-icon-forward">6</li></ul>On mouse hover($("li.hvr-icon-forward").hover) I am able to change the color of the first element (class=.hvr-underline-from-left) which lies above class=hvr-icon-forward$("li.hvr-icon-forward").hover( function () { $(this).prevAll("li.hvr-underline-from-left:first").css('color', '#006cb4') }, function () { $(this).prevAll("li.hvr-underline-from-left:first").css('color', 'black') } ); });But how can i change the css property of the first element's psuedo element which lies above class=hvr-icon-forward .hvr-underline-from-left { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; overflow: hidden;}.hvr-underline-from-left:before { content: ""; position: absolute; z-index: -1; left: 0; right: 100%; bottom: 0; background: #2098d1; height: 4px; -webkit-transition-property: right; transition-property: right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}Exactly I want to change property( right: 0; from right:100%;) in pseudo element class (.hvr-underline-from-left:before) on above mouse hover logic 解决方案 ("li.hvr-icon-forward").hover) I am able to change the color of the first element (class=.hvr-underline-from-left) which lies above class=hvr-icon-forward("li.hvr-icon-forward").hover( function () {(this).prevAll("li.hvr-underline-from-left:first").css('color', '#006cb4') }, function () { 这篇关于如何操作第一个先前的psuedo元素类属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！