CSS border-style 属性使用方法
所属分类:
网页制作 / CSS
阅读数:
2054
收藏 0赞 0分享
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;
}
如果只定义一个值,这个值就代表四个边的.定义梦之都段落的边框为点划线.
前端设计师需要了解的9个问题
这篇文章主要介绍了前端设计师需要了解的9个问题以及注意事项,非常的实用,是篇非常不错的文章,这里推荐给大家
收藏 0赞 0分享
CSS强制性换行的方法区别详解
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法对于div,p等块级元素正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行
收藏 0赞 0分享
CSS语义化命名方式及常用命名规则
本文搜集了一些CSS语义化命名方式以及命名规则。如有错误或不妥之处,敬请指出,欢迎你提出更好的建议,加插更多的命名规范。
收藏 0赞 0分享
ul li内容宽度的问题的解决方案
在IE6下只要我设置LI的宽度为auto,不论LI里面的内容多长,LI的宽度始终是100%,即UL的宽度(这里我已经写死了UL的宽度)。设置max-width也没用。高手们,在IE系列浏览器中如何使LI的宽度真正的随着内容增长而增长呢?像FF那样。
收藏 0赞 0分享
html5+css3气泡组件的实现
本文是html5+css3系列教程的第一篇,给大家讲述html5+css3实现气泡组件,讲解的十分的详细,这里推荐给大家,希望对大家能有所帮助
收藏 0赞 0分享
html5+css3之CSS中的布局与Header的实现
本文从CSS3的布局(CSS的布局的演化、CSS3盒模型-box-sizing、float布局中的bfc、Flexbox简介)Header布局的实现(float实现布局、Header js的实现)向我们展示了HTML5与CSS3的魅力。
收藏 0赞 0分享
CSS3提交意见输入框样式代码
这个提交意见输入框,结构使用到了table,样式用的css3,包含了多方面的知识,比较适合新手朋友们
收藏 0赞 0分享
查看更多