css零到一基础教程021：CSS 圆角边框

最新推荐文章于 2023-07-31 14:50:07 发布

慕容屠苏

最新推荐文章于 2023-07-31 14:50:07 发布

阅读量605

点赞数

分类专栏： css零到一文章标签： css html 前端

本文链接：https://blog.csdn.net/kerryqpw/article/details/123590548

版权

css零到一专栏收录该内容

98 篇文章 2 订阅 ¥49.90 ¥99.00

订阅专栏

超级会员免费看

本文是关于CSS如何实现元素圆角边框的教程，主要介绍了border-radius属性的使用。

摘要由CSDN通过智能技术生成

CSS 圆角边框

border-radius 属性用于向元素添加圆角边框：

<!DOCTYPE html>
<html>
<head>
<style>
p.normal {
  border: 2px solid red;
}

p.round1 {
  border: 2px solid red;
  border-radius: 5px;
}

p.round2 {
  border: 2px solid red;
  border-radius: 8px;
}

p.round3 {
  border: 2px solid red;
  border-radius: 12px;
}
</style>
</head>
<body>

<h1>border-radius 属性</h1>

<p>此属性用于为元素添加圆角：</p>

<p class="normal">普通边框</p>
<p class="round1">圆角边框</p>
<p class="round2">角更圆的边框</p>
<p class="round3">角最圆的边框</p>

</body>
</html>

了解本专栏

超级会员免费看

慕容屠苏

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
css零到一基础教程021：CSS 圆角边框

CSS 圆角边框border-radius属性用于向元素添加圆角边框：<!DOCTYPE html><html><head><style>p.normal { border: 2px solid red;}p.round1 { border: 2px solid red; border-radius: 5px;}p.round2 { border: 2px solid red; border-radiu..
复制链接

扫一扫