如何在CSS中進行自定義高亮顯示？

^類似的東西 - 它使用：後？（無法做到多行）

.home-about h3:after{ 
margin-top:-15px; 
content: " "; 
background:#d7edf4; 
z-index: 0; 
}

來源

2017-04-25 user7214732

你可以使用兩個H3的位置屬性和： – Ibu

後':: after'僞元素有兩個冒號。一個冒號是舊的語法，不應該再使用。 https://developer.mozilla.org/en-US/docs/Web/CSS/:: – Rob

是的，你可以使用僞元素。這裏有一種絕對定位在h3中的負z指數的方法。

h3 { 
 
    position: relative; 
 
    display: inline-block; 
 
} 
 

 
h3:after { 
 
    content: " "; 
 
    background: #d7edf4; 
 
    z-index: -1; 
 
    display: block; 
 
    position: absolute; 
 
    bottom: 0; 
 
    left: 0; 
 
    right: 0; 
 
    height: .4em; 
 
}

<h3>text</h3>

來源

2017-04-25 23:44:43

':: after'僞元素有兩個冒號。一個冒號是舊的語法，不應該再使用。 https://developer.mozilla.org/en-US/docs/Web/CSS/:: – Rob

@Rob是啊我知道，但IE的舊版本不認識':: after'，只能用於：之後，但所有較新的瀏覽器都支持這兩種瀏覽器。在現代瀏覽器停止支持'：after'之前，我寧願覆蓋我的基地，並使用'：after'來滿足瀏覽器的要求。 https://msdn.microsoft.com/library/cc304078(v=vs.85).aspx –

讓我們這樣說吧。如果您**必須**支持Microsoft的Internet Explorer 8或更高版本，請使用'：after'。沒有其他原因。否則，請退出支持Microsoft Internet Explorer 8及更高版本。 – Rob

試試這個：

::selection { 
    background: #ffb7b7; /* WebKit/Blink Browsers */ 
} 
::-moz-selection { 
    background: #ffb7b7; /* Gecko Browsers */ 
}

下面是動作的代碼：

.Pink::selection {background: #ffb7b7; /* WebKit/Blink Browsers */} 
 
.Pink::-moz-selection {background: #ffb7b7; /* Gecko Browsers */} 
 

 
.DarkRed::selection {background: #ff0000; /* WebKit/Blink Browsers */} 
 
.DarkRed::-moz-selection {background: #ff0000; /* Gecko Browsers */}

<p class="Pink">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean tristique quam in ex posuere, eu commodo velit sodales. Vestibulum at volutpat lorem, quis interdum diam. Phasellus metus sem, lobortis eu neque eget, tincidunt hendrerit purus. Sed mollis orci dapibus lectus blandit, eget fringilla sapien ullamcorper. Aenean accumsan justo sit amet sapien finibus tincidunt. Nam vitae purus ligula. Nunc quis neque id enim ultricies euismod at id metus. In hac habitasse platea dictumst. Sed suscipit, augue id tempus blandit, orci sem faucibus turpis, ac volutpat sem enim eleifend dui. Maecenas congue augue at lacus viverra rhoncus. </p> 
 

 
<p class="DarkRed">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean tristique quam in ex posuere, eu commodo velit sodales. Vestibulum at volutpat lorem, quis interdum diam. Phasellus metus sem, lobortis eu neque eget, tincidunt hendrerit purus. Sed mollis orci dapibus lectus blandit, eget fringilla sapien ullamcorper. Aenean accumsan justo sit amet sapien finibus tincidunt. Nam vitae purus ligula. Nunc quis neque id enim ultricies euismod at id metus. In hac habitasse platea dictumst. Sed suscipit, augue id tempus blandit, orci sem faucibus turpis, ac volutpat sem enim eleifend dui. Maecenas congue augue at lacus viverra rhoncus. </p>

讓我知道你走了。

乾杯

來源

2017-04-26 00:37:04 Syfer

如何在CSS中進行自定義高亮顯示？

回答

相關問題