如何使用CSS将div设置为三角形?

Kam*_*esh 1 html css styling

我想用CSS制作一个矩形分区的三角形.任何帮助将非常感激.

小智 6

不确定我是否理解这个问题,但是如果你需要在那里创建那个小三角形,你应该使用边框.

你可以在这里找到更多

http://css-tricks.com/examples/ShapesOfCSS/

你的div应该具有正常的属性(背景颜色,填充等等和位置相对),然后定义:

div:after{
content:"";
position:absolute;
left: -100px /* the width of your triangle */
top:0;
height: 0;
 border-top: 50px solid transparent; /* half the height of your div */
border-left: 100px solid red; /* width of the triangle  + the color of your background*/
border-bottom: 50px solid transparent; /* half the height of your div */
width: 0; 
}
Run Code Online (Sandbox Code Playgroud)

希望我没有忘记任何事情