如何讓背景圖像對角線從一側？

Question

如何製作背景圖像的一個對角線側？
我想用CSS，CSS3或jQuery來做，而不是用photoshop。我也需要幫助在對角線上創建邊框。

Answer 1

這裏是你如何把一個三角形的股利。這應該有助於你開始。

div { 
 
    background-color: red; 
 
    width: 200px; 
 
    height: 200px; 
 
} 
 
div::after { 
 
    content: ' '; 
 
    border-top: 200px solid rgba(0, 0, 0, 0); 
 
    border-right: 50px solid #000; 
 
    width: 0px; 
 
    display: block; 
 
    float: right; 
 
}

<div></div>