小白教程
所有教程
关于
Search
172.69.59.106
172.69.59.106
参数设置
贡献
退出
操作
编辑
移动
保护
信息
历史
删除
查看“Css3 pr border bottom left radius”的源代码
本页内容
上一节:
Pr_border_bottom_color
下一节:
Css3_pr_border_bottom_right_radius
因为以下原因,您没有权限编辑本页:
您请求的操作仅限属于该用户组的用户执行:
用户
您可以查看和复制此页面的源代码。
{{DISPLAYTITLE:border-bottom-left-radius}}[[Category:css animatable|15]] = CSS3 border-bottom-left-radius 属性 = 为div元素的左下角添加圆角边框: <sample title="" desc="" lang="html" hererun="1"> div { border:2px solid; border-bottom-left-radius:2em; } </sample> <run name=""> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小白教程(xiaobai.wang)</title> <style> div { border:2px solid; padding:10px; background:#dddddd; border-bottom-left-radius:2em; } </style> </head> <body> <div>border-bottom-left-radius 属性允许您向左下角添加圆角边框。</div> </body> </html> </run> == 浏览器支持 == 表格中的数字表示支持该属性的第一个浏览器版本号。 紧跟在 -webkit-, -ms- 或 -moz- 前的数字为支持该前缀属性的第一个浏览器版本号。 {| class="table table-striped table-hover" ! 属性 ! Internet Explorer ! Chrome ! Firefox ! Safari ! Opera |- | border-radius | 9.0 | 5.04.0 -webkit- | 4.03.0 -moz- | 5.03.1 -webkit- | 10.5 |} == 属性定义及使用说明 == border-bottom-left-radius 属性定义左下角边框的形状。 '''提示:''' 这个属性允许你添加元素的圆角边框! {| class="table table-striped table-hover" | 默认值: | 0 |- | 继承: | no |- | 版本: | CSS3 |- | JavaScript 语法: | object object.style.borderBottomRightRadius="5px" |} == 语法 == border-bottom-left-radius: length|% [length|%]; '''注意:'''注如果您设置了两个值,第一个用于下边框,第二个用于左边框。 如果省略第二个值,则从第一个值复制。 当其中一个值为 0 时,圆角将不被设置,这时这个角将展示为直角。 <pre>/* 圆形 */ /* border-bottom-left-radius: radius */ border-bottom-left-radius: 3px; /* 椭圆形 */ /* border-bottom-left-radius: 水平方向 垂直方向 */ border-bottom-left-radius: 0.5em 1em; border-bottom-left-radius: inherit;</pre> {| class="table table-striped table-hover" ! 值 ! 说明 |- | length | 定义右下角的形状。 |- | % | 使用%定义右下角的形状。 |} == 相关文章 == CSS3 教程: [[css3 borders|CSS3 边框]]
返回至“
Css3 pr border bottom left radius
”。
上一节:
Pr_border_bottom_color
下一节:
Css3_pr_border_bottom_right_radius