怎样用CSS使层的四个边角变的圆滑一些
3个回答
展开全部
用到了这条代码:border-radius-left,top,bottom,right
例子如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div style="border:3px #000 solid;border-top-right-radius:10px; border-top-left-radius:5px; border-bottom-left-radius:6px; border-bottom-right-radius:20px; width:50px; height:50px; background:#f60;"></div>
<div style="border:3px #000 solid;border-radius:10px; width:50px; height:50px; background:#fff;"></div>
</body>
</html>
例子如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div style="border:3px #000 solid;border-top-right-radius:10px; border-top-left-radius:5px; border-bottom-left-radius:6px; border-bottom-right-radius:20px; width:50px; height:50px; background:#f60;"></div>
<div style="border:3px #000 solid;border-radius:10px; width:50px; height:50px; background:#fff;"></div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
border-radius-left,top,bottom,right
必须用新版的浏览器
必须用新版的浏览器
追问
能给个例子吗?谢啦!!!
追答
无标题文档
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<!--HTML-->
<div class="navi">
</div>
/*CSS*/
.navi{
width:50%;
height: 50px;
background-color: rgb(206,48,99);
border-radius:10px;
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询