2021.4.7 北京林业大学 web前端开发基础 CSS3 圆角边框与阴影、文字与文本、2D变换

CSS3 圆角边框与阴影

一、CSS3新特性
1.圆角边框、阴影、分列、2D3D、动画
2.根据浏览器支持度选择是否添加前缀：
浏览器内核 Webkit、Gecko、Presto、Trident
浏览器 Safari Chrome、Firefox、Opera、IE
CSS3前缀 -webkit-、-moz-、-o-、-ms-
二、圆角边框（border-radius）
border-top-left-radius（左上）
border-top-right-radius （右上）
border-bottom-left-radius（左下）
border-bottom-right-radius （右下）
border-radius
 水平值
 垂直值
例如：

div {
   
height: 100px;
width: 150px;
border: 1px solid blue;
border-top-left-radius: 40px 20px;
border-bottom-right-radius:20px;
}

div
{
   
width:350px;
height:50px;