标签:width form oct type round logs tle text mon
特殊图形的制作在开发的过程中式必不可少的,其中菱形和三角形的应用是比较广泛的,下面将用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>
标签:width form oct type round logs tle text mon
原文地址:http://www.cnblogs.com/alisa-sister/p/7707183.html