利用CSS绘制三角形
本方法参考来源：https://www.jianshu.com/p/9a463d50e441
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>triangleCSS</title>
<style>
#triangle{
width: 0;
height: 0;
/*border其实是由三角形不断减小高度变为梯形而成的
平常宽度较小的border是对应三角形的底边
增大border宽度时这个特性将会明显*/
/*border-top: 50px solid blue;
border-right: 50px solid red;
border-bottom: 50px solid green;
border-left: 50px solid yellow;*/
/*单个三角形（但另外三边框对应的三角形仍占据空间）*/
/*border: 50px solid;
border-color: transparent transparent red;*/
/*尺寸最小化的三角形*/
border-width: 0 50px 50px;
border-style: solid;
border-color: transparent transparent red;
}
</style>
</head>
<body>
<div id="triangle"></div>
</body>
</html> 相关推荐
猫沙盆 2020-07-07
葉無聞 2020-06-09
buttonChan 2020-04-10
sdbxpjzq 2019-12-03
沈宫新 2020-02-23
sdbxpjzq 2019-10-26
zengni 2019-10-21
libowen0 2014-07-08
猫沙盆 2017-05-04
zhouguizhi 2018-02-14
ZiXuanFY 2007-04-12
淡风wisdon大大 2019-08-01
我就是停不下来 2019-07-01
jiedinghui 2019-07-01
wangnantjobj 2019-07-01
yongquanx 2019-07-01
lanzhusiyu 2019-06-29