色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css樣式怎樣畫多邊形的

夏志豪2年前10瀏覽0評論

CSS 是一種交互式樣式表語言,用于為 HTML 和 XML(包括諸如 SVG、MathML 和 XUL 等 XML 類別)文檔的呈現添加樣式。CSS 可用于對 HTML 中的元素應用樣式。它可以改變 HTML 元素的大小、顏色、位置、字體和其他屬性。這里將會向大家介紹如何使用 CSS 樣式來畫多邊形。

.polygon {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-bottom: 50px solid transparent;
border-left: 100px solid red;
}

通過上面的代碼來畫一個紅色的等腰三角形。 接下來,讓我們看看如何畫一個正五邊形:

.polygon {
position: relative;
width: 0;
height: 0;
border-style: solid;
border-width: 0 100px 173.2px 100px;
border-color: transparent transparent #007bff transparent;
}

上面的代碼通過設置不同的 border 寬度和顏色,實現了畫正五邊形。同樣的技巧也可以用來畫其他形狀,比如矩形、梯形和菱形等等。

除此之外,還可以使用偽元素來實現更靈活多變的圖形。比如通過旋轉和網格線來畫出一個六邊形:

.hexagon {
position: relative;
width: 100px;
height: 57.74px;
margin: 28.87px 0;
background-color: #007bff;
}
.hexagon:before,
.hexagon:after {
content: "";
position: absolute;
width: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
}
.hexagon:before {
bottom: 100%;
border-bottom: 28.87px solid #007bff;
}
.hexagon:after {
top: 100%;
width: 0;
border-top: 28.87px solid #007bff;
}

上面的代碼通過使用 before 和 after 偽元素來畫出一個六邊形。這種方法可以應用于其他圖形,比如三角形、菱形和梯形等等。

總之,CSS 樣式可以實現多種多樣的多邊形圖形,只要我們掌握了基本的技巧和知識,就可以輕松地實現各種形狀的圖形。