帶透明BG的CSS前導點

Question

我正在尋找一種在文本元素後面創建前導點的方法。我需要一些圍繞h1元素具有透明背景的東西。這裏是我的解決方案需要的樣子：http://www.redhatsociety.com/sites/all/themes/red_hat_society/images/partners/sample.png

這裏是我現在不工作：http://redhatsociety.com/rhs-hoot-day/prizes

任何人都知道一個解決方案嗎？

Answer 1

使用像這樣的僞元素。

Codepen Demo

h2 { 
 
    position: relative; 
 
    overflow: hidden; 
 
    width:80% /* not required */ 
 

 
} 
 

 
h2 span { 
 
    display: inline-block; 
 
    width:50%; 
 
} 
 

 
h2:after { 
 
    content: ""; 
 
    position: absolute; 
 
    top:50%; 
 
    border: 3px red; 
 
    border-style:dashed; 
 
    width: 9999px; /* some huge width */ 
 
}

<h2> 
 
<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Saepe error ea nam corporis hic libero culpa excepturi perspiciatis, necessitatibus</span> 
 
</h2>