円はサイトのUIやグラフィックに多く使われる基本的な形状です。 今回は、CSSだけで円を描く方法と、その中でも重要な役割を果たすborder-radiusプロパティの解説をします。 CSSで円を描く方法 まず、円を描くためには、HTMLを用意します。 <div class="circle"></div> 背景色を指定す…

方法①三角形を入れる <div class="hexagon"></div> .hexagon { position: relative; width: 100px; height: 57.74px; background-color: #333; margin: 28.87px 0; } .hexagon::before, .hexagon::after { content: ""; position: absolute; width: 0; border-left: 50px solid transpar…