叶子制作模式

最新推荐文章于 2025-07-28 15:07:33 发布

原创最新推荐文章于 2025-07-28 15:07:33 发布 · 223 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种使用CSS实现半圆显示的方法。通过设置div元素的宽度为高度一半，并将两个圆角设置为等同于高度的值，可以轻松创建一个半圆形。此技巧适用于网页设计中需要使用半圆形装饰或指示的应用场景。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{
width:150px;
height:300px;
background:red;
border-radius:0 300px 0 300px;
}
</style>
</head>
<body>

<div></div>
</body>
</html>