<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<!--网页中常见的一些三角形,使用css直接画出来就可以,不必做成图片或者字体图标-->
<style>
.box1 {
width: 0;
height: 0;
/*border: 10px solid pink;*/
border-top: 10px solid pink;
border-right: 10px solid red;
border-bottom: 10px solid blue;
border-left: 10px solid green;
}
.box2 {
width: 0;
height: 0;
border: 10px solid transparent;
border-left-color: pink;
}
</style>
</head>
<body>
<div class="box1"></div>
<div class="box2"></div>
</body>
</html>
CSS三角形
最新推荐文章于 2024-08-04 20:38:28 发布