查看: 2731|回复: 0

[转帖]border-bottom定义

1788 主题	62 好友	8525 积分

管理员

Rank: 9 Rank: 9 Rank: 9

发消息

电梯直达

楼主

发表于 2011-2-9 11:01:38 |只看该作者 |倒序浏览

border-bottom-style 设置元素下边框的样式。　　只有当这个值不是 none 时边框才可能出现。　　在 CSS1 中，HTML 用户代理只需支持 solid 和 none。　　继承性：No

border-bottom注解

　　border-bottom 属性是一种复合属性，用于设置对象的下边框的宽度、样式和颜色值。　　所有未由 border-bottom 复合属性设置的单独边框属性都将设置为其默认值。例如，width 的默认值为 medium 。　　如果未指定颜色，则使用文本颜色。

编辑本段border-bottom值

　　一个字符串，用于指定或接收下列一个或多个空格分隔值：

一、颜色

　　可用于 border-bottom-color 属性的任何颜色值范围。　　一个变量，用于指定或接收一个默认 HTML 颜色名称或 RGB 值。　　该属性无默认值。该属性不会被继承。　　注解　　某些浏览器无法识别颜色名称，但是所有浏览器都应该识别 RGB 颜色值并能够正确显示它们。　　示例　　以下示例使用 border-bottom-color 属性指定下边框的颜色。本示例通过调用内嵌（全局）样式表，在 onmouseover 事件发生时将下边框的颜色从 red 更改为 blue ：　　<head><style> 　　td { border-bottom-color: red; 　　border-width: 0.5cm; border-style: groove; } 　　.blue { border-bottom-color: blue; } 　　</style> 　　</head> 　　<body> 　　<table border > 　　<tr> 　　<td > 　　<img src="sphere.jpg"> 　　</td> 　　</tr> 　　</table>

二、样式

　　可用于 border-bottom-style 属性的任何样式值范围。　　可能的值属性描述　none 定义无边框。　　hidden 与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。　　dotted 定义点状边框。在大多数浏览器中呈现为实线。　　dashed 定义虚线。在大多数浏览器中呈现为实线。　　solid 定义实线。　　double 定义双线。双线的宽度等于 border-width 的值。　　groove 定义 3D 凹槽边框。其效果取决于 border-color 的值。　　ridge 定义 3D 垄状边框。其效果取决于 border-color 的值。　　inset 定义 3D inset 边框。其效果取决于 border-color 的值。　　outset 定义 3D outset 边框。其效果取决于 border-color 的值。　　注解　　必须设置大于零的 border-width ，以便呈现 border-bottom-style 属性。　　　示例　　以下示例使用 border-bottom-style 属性来指定边框样式。此示例通过调用内嵌样式表将下边框的样式更改为 groove ：　　<head><style> 　　td { border-bottom-style: solid; border-width: 0.3cm; } 　　.change { border-bottom-style: groove; } 　　</style> 　　</head> 　　<body> 　　<table border > 　　<tr> 　　<td > 　　<img src="sphere.jpg"> 　　</td> 　　</tr> 　　</table>

三、width

　　可用于 border-bottom-width 属性的任何宽度值范围。该属性的默认值为 medium 。该属性不会被继承。　　可能的值　　一个变量，用于指定或接收下列值之一：　　medium 默认值。　　thick 大于默认宽度。　　thin 小于默认宽度。　　宽度浮点数，后跟绝对单位指示符（ cm 、 mm 、 in 、 pt 或 pc ）或相对单位指示符（ em 、 ex 或 px ）。　　示例　　以下示例使用 border-bottom-width 属性指定边框宽度。本示例通过调用内嵌（全局）样式表，在鼠标单击发生时将下边框的宽度更改为 1 厘米：　　<head><style> 　　td { border-bottom-width: 3mm; } 　　.changeborder 1 { border-bottom-width: 1cm; } 　　</style> 　　</head> 　　<body> 　　<table border > 　　<tr> 　　<td > 　　<img src="sphere.jpg"> 　　</td> 　　</tr> 　　</table>

编辑本段示例

　　以下示例使用 border-bottom 属性来指定复合属性。本示例通过调用内嵌（全局）样式表，在 onmouseover 事件发生时更改右边框的属性：　　<head> 　　<style> 　　td { border-bottom: 0.3cm cyan dashed; } 　　.change { border-bottom: 0.1cm yellow solid; } 　　</style> 　　</head> 　　<body> 　　<table> 　　<tr> 　　<td 　　> 　　<img src="sphere.jpg"></td> 　　</tr> 　　</table>

淘帖0 分享0 收藏0

　　你的沉默明亮如灯、简单如指环。

　　论坛其他名字　【云水.墨】　【淡墨瀑雪】

使用道具举报

返回列表

		自动登录	找回密码
密码			立即注册