当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > CSS教程:学习border-style属性

CSS样式表
CSS选择器支持列表
CSS基础教程:CSS样式表与具体设备
再谈动态添加样式规则
CSS模型教程:boxes,borderes,margins和padding
IE中选择符的4095限制
Jacascript和CSS实现Mac OS导航菜单
CSS网页制作教程:网页首页设计实例
CSS教程:CSS制作漂亮的灵活的图表
css框架是什么
推荐一份不错的reset.css
IE7下position:relative的问题
WEB标准的思想是什么?
优先选择W3C推荐的标准规范
CSS教程:彻底掌握Z-index属性
CSS高级技巧:圆角矩形
css对于字体和背景等属性的控制
CSS实现网页表格行鼠标滑过高亮显示
CSS3的border-radius属性定义HTML元素的圆角
Web流程图绘制的心得
CSS网页布局教程:绝对定位和相对定位

CSS样式表 中的 CSS教程:学习border-style属性


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 77 ::
收藏到网摘: n/a

border-style -- 定义边框的样式
取值:<border-style>{1,4} | inherit
<border-style>{1,4}: 边框样式
inherit: 继承
初始值: none
继承性: 否
适用于: 所有元素
border:边框,style:样式
border-style和border-width的赋值方式是一样的,可以分别赋1,2,3或4个边的样式.

border-style的取值
none: 无样式
hidden: 除了同表格的边框发生冲突的时候,其它同none
dotted: 点划线
dashed: 虚线
solid: 实线
double: 双线,两条线加上中间的空白等于border-width的取值
groove: 槽状
ridge: 脊状,和groove相反
inset: 凹陷
outset:凸出,和inset相反
软晨学习网提示: 由于border-style的初始值为none,所以除非设置了边框样式,否则边框将无法看见.

示例
p#fourborders
{
 border-style:dotted dashed solid double;
}
如果定义四个值,那么这四个值就分别是上,右,下,左边框(从上边框开始,以顺时针的顺序遍历).定义梦之都段落的上边框为点划线,右边框为虚线,下边框为实线,左边框为双线.

p#threeborders
{
 border-style:groove ridge outset;
}
如果只定义三个值,中间的值代表左和右边框.定义梦之都段落的上边框为槽状,下边框为凸出,左,右边框为脊状.

p#twoborders
{
 border-style:none dashed;
}
如果只定义两个值,前面的值代表上下边框,后面的值代表左右边框.定义梦之都段落的上,下边框为无样式,左,右边框为虚线.

p#oneborders
{
 border-style:dotted;
}
如果只定义一个值,这个值就代表四个边的.定义梦之都段落的边框为点划线.