2017-02-10 105 views
0

我想創建在跨越頁面寬度HTML兩個div之間的三角形跨越三角形(參見下圖)。HTML創建跨頁面寬度

enter image description here

我不知道什麼的arrow_down DIV的CSS應該是

<div id="top_section" style="width:100%;"> 
<div id="arrow_down"> 
</div> 
</div> 
<div id="bottom_section" style="width:100%;"> 
</div> 

回答

4

使用僞元素:後

#top_section:after { 
    content:''; 
    position: absolute; 
    top: 100%; 
    left: 0; 
    width: 0; 
    height: 0; 
    border-top: solid 60px #ddd; 
    border-left: solid 50vw transparent; 
    border-right: solid 50vw transparent; 
} 

http://jsfiddle.net/gb6otzqr/