css3制作图形大全 https://www.jqhtml.com/8045.html
border-radius
https://www.cnblogs.com/happymental/p/7891725.html
border-radius: 1-4 length|% / 1-4 length|%;
1-4指的是radius的四个值，length和%指的是值的单位。border-radius的数值有三种表示方法：px、%、em .
参数：
四个参数：顺时针方向，上左，上右，下右，下左
三个参数的时候，是上左，上右和下左，下右
两个参数的时候，是上左和下右，上右和下左（对角线相等）
一个参数：给元素的四个边角设置统一的圆角弧度
这里的border-radius大小如何理解呢？
1. 如果设置它的border-radius的值为30px，那么实际呈现的圆角，其实就是一个以30px为半径的圆顶格放置在四个边角后所呈现的弧度，那么当大小等于border大小的时候就是刚好一个半圆形状了。
第二个图相比第一个图，不只边角的圆润程度变缓，而且content范围变小，被那个同色的扇形覆盖了。很好的解释了边框圆角就相当于一个同色的1/4圆抵在了角上。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>feng</title>
<style>
.radius{
display: inline-block;
width: 50px;
height: 50px;
border: 50px solid #fe626d;
border-radius: 50px;
}.radius2{
display: inline-block;
wid
最低0.47元/天 解锁文章
116
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
