特殊图形的制作在开发的过程中式必不可少的,其中菱形和三角形的应用是比较广泛的,下面将用css制作两款简单而常用的图形:三角形、菱形。
一、三角形的代码实现过程:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>triangle</title>
<style type="text/css">
.triangle{
width: 0;
border: 100px solid;
border-color: red transparent transparent transparent;
margin: 100px auto;
}
</style>
</head>
<body>
<div class="triangle"></div>
</body>
</html>
二、菱形的代码实现过程:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>diamond</title>
<style type="text/css">
.diamond{
width: 200px;
height: 200px;
background-color: red;
transform: rotate(45deg);
margin: 100px auto;
}
</style>
</head>
<body>
<div class="diamond"></div>
</body>
</html>
原文:http://www.cnblogs.com/alisa-sister/p/7707183.html