边框三角形

最新推荐文章于 2024-05-06 01:15:56 发布

NIUMIN_boke

最新推荐文章于 2024-05-06 01:15:56 发布

阅读量197

点赞数

文章标签：边框三角形

本文链接：https://blog.csdn.net/NIUMIN_boke/article/details/103232140

版权

边框三角形

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
.top{ width:0px; border-top:10px solid red; border-left:10px solid #fff; border-right:10px solid #fff;}
/*生成一个宽高为0，上左右边框为10像素，左右边框颜色为网页的默认背景颜色白色的倒立三角形，边框三角形的大小调整边框像素的大小即可*/
.bottom{ width:0px; border-bottom:10px solid pink; border-left:10px solid #fff; border-right:10px solid #fff;}
/*生成一个宽高为0，下左右边框为10像素，左右边框颜色为网页的默认背景颜色白色，的正立三角形*/
</style>
<title>边框三角形</title> 
</head>
<body>
	<div class="top"></div>
	<div class="bottom"></div>
</body>
</html>