Css属性：border边框，设置圆角，border

2023-11-02 17:15| 来源: 网络整理| 查看: 265

border边框 1.CSS border 属性2.CSS 圆角边框制作圆形效果图：

1.CSS border 属性

允许您指定元素边框的样式、宽度和颜色。 solid - 定义实线边框 dashed - 定义虚线边框

border 属性是以下各个边框属性的简写属性： border-width border-style（必需） border-color

简写border: 2px solid red;

Document div{ width: 300px; height: 300px; background-color: pink; border: 2px solid red; }

没加之前border: 2px solid red;

在这里插入图片描述加了之后：

2.CSS 圆角边框

border-radius 属性用于向元素添加圆角边框：可设置圆角的所有四个 border-*-radius 属性。上下的左右边框加这个：

border-radius: 50px 50px 50px 50px;

效果图：在这里插入图片描述

制作圆形

可以设置： border-radius: 80%;（）上下的左右边框，圆角为80%，元素宽度的80%，设置为100%，靠近圆形

Document div{ width: 30px; height: 30px; background-color: pink; border: 2px solid red; /* border-radius: 50px 50px 50px 50px;*/ border-radius: 80%; } 效果图：

在这里插入图片描述

【本文地址】

公司简介

联系我们