CSS自定義下劃線

-3

我試圖在我的文本中添加一個自定義的超高下劃線。CSS自定義下劃線

它需要適應這種語法，所以我可以放回我的所見即所得的編輯器：

<p data-font-size="50px"><span style="letter-spacing:2px;"> 
    <span class="custom_one"><span style="color:#ffffff;">A software platform that makes 
    devices feel more human.</span></span></span> 
</p>

這裏是我想要做的一個畫面：

來源

2017-06-21 villain

嗯，這是少下劃線的，多的文本行的後面。既然你想保留內聯文本流屬性，我認爲所有沿僞元素和絕對定位的東西都是不成問題的。你最好的選擇是背景漸變;但是這不是你想要嵌入到所有供應商前綴的內聯樣式屬性中的東西。 – CBroe

這不是下劃線，而是背景。您可以使用梯度：

.custom_one { 
 
    background: linear-gradient(transparent 60%, #333 60%); 
 
    font-size: 42px; 
 
}

<p data-font-size="50px" style="background-color: #000;"><span style="letter-spacing:2px;"> 
 
    <span class="custom_one"><span style="color:#ffffff;">A software platform that makes 
 
    devices feel more human.</span></span> 
 
    </span> 
 
</p>

來源

2017-06-21 22:22:24

@villain或者，也許這可以幫助你？

<p data-font-size="50px"> 
 
    <span style="letter-spacing:2px; background-color: gray"> 
 
    <span class="custom_one"> 
 
     <a style="color: white; text-decoration: none; border-bottom: 10px solid black;" >A software platform that makes 
 
    devices feel more human. 
 
     </a> 
 
    </span> 
 
    </span> 
 
</p>

來源

2017-06-21 22:24:37

CSS自定義下劃線

回答

相關問題