首頁猿問誰能做個(gè) 正三角倒三角...

誰能做個(gè) 正三角倒三角等邊三角形的demo！

JavaScript

19990000 2016-11-11 22:47:18

順便說下有什么區(qū)別

查看完整描述

1 回答

已采納

stone310

TA貢獻(xiàn)361條經(jīng)驗(yàn) 獲得超191個(gè)贊

正三角border四邊相等；等邊三角左右和上下比為4：3；倒三角同等邊三角

<!DOCTYPE?html>
<html>
<head>
????<meta?charset="utf-8">
????<style>
????????span{position:absolute}
????????.span1?{
????????????top:50px;
????????????border-bottom:50px?solid?#000;
????????????border-left:50px?solid?transparent;
????????????border-right:50px?solid?transparent;
????????????border-top:50px?solid?transparent;???/*?這條邊可去掉，占位更小*/
????????}
????????.span2?{
????????????border-bottom:40px?solid?#000;
????????????border-left:30px?solid?transparent;
????????????border-right:30px?solid?transparent;
????????????border-top:40px?solid?transparent;?????/*?這條邊可去掉，占位更小*/

????????}
????????.span3?{
????????????border-bottom:40px?solid?transparent;???/*?這條邊可去掉，占位更小*/
????????????border-left:30px?solid?transparent;
????????????border-right:30px?solid?transparent;
????????????border-top:40px?solid??#000;
????????}
????</style>
</head>
<body>
<span?class="span1"></span>
<span?class="span2"></span>
<span?class="span3"></span>
</body>
</html>

1 反對(duì) 回復(fù) 2016-11-11