CSS border-style 属性
2023-09-27 14:27:48 时间
实例
设置 4 个边框的样式:
p
{
border-style:solid;
}
浏览器支持
IE | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|
所有浏览器都支持 border-style 属性。
注释:任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit" 或 "hidden"。
定义和用法
border-style 属性用于设置元素所有边框的样式,或者单独地为各边设置边框样式。
只有当这个值不是 none 时边框才可能出现。
例子 1
border-style:dotted solid double dashed;
- 上边框是点状
- 右边框是实线
- 下边框是双线
- 左边框是虚线
例子 2
border-style:dotted solid double;
- 上边框是点状
- 右边框和左边框是实线
- 下边框是双线
例子 3
border-style:dotted solid;
- 上边框和下边框是点状
- 右边框和左边框是实线
例子 4
border-style:dotted;
- 所有 4 个边框都是点状
默认值: | not specified |
---|---|
继承性: | no |
版本: | CSS1 |
JavaScript 语法: | object.style.borderStyle="dotted double" |
可能的值
值 | 描述 |
---|---|
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 的值。 |
inherit | 规定应该从父元素继承边框样式。 |
描述
最不可预测的边框样式是 double。它定义为两条线的宽度再加上这两条线之间的空间等于 border-width 值。不过,CSS 规范并没有说其中一条线是否比另一条粗或者两条线是否应该是一样的粗,也没有指出线之间的空间是否应当比线粗。所有这些都有用户代理决定,创作人员对这个决定没有任何影响。
TIY 实例
本例演示如何设置四边框样式。
本例演示如何在元素的各边设置不同的边框。
相关页面
CSS 教程:CSS 边框
HTML DOM 参考手册:borderStyle 属性
相关文章
- 019 关联映射文件中集合标签中的lazy(懒加载)属性
- CSS opacity 属性
- 小程序/CSS的font-weight属性
- 小程序/CSS阴影属性box-shadow
- jquery 属性操作 attr( ) prop()css( )区别
- matlab学习笔记12_3串联结构体,按属性创建含有元胞数组的结构体,filenames,isfield,isstruct,orderfields
- vue动态添加对象属性,视图不渲染
- 【Css】Css有关html“属性选择器”的语法合集(示例)
- 每日一学—CSS cursor 属性
- 第113章 属性关键字 - SqlComputeOnChange
- 第112章 属性关键字 - SqlComputed
- 第101章 属性关键字 - InitialExpression
- 《R语言数据挖掘》----1.10 数据属性与描述
- 隐藏元素的方法、display属性的值及意义、定位position值及其意义
- 聊一聊CSS中的盒模型和box-sizing属性
- AutoMapper在MVC中的运用04-string映射各种类型、一个属性映射多个属性等
- BW导航属性设置
- css旋转属性如何理解
- CSS属性使用反思
- java获取对象属性类型、属性名称、属性值
- 浅析CSS中过渡transition学习:animation与transition的区别、过渡的4个属性及简写模式、过渡触发方式、过渡渐变(需绝对值)、如何使用硬件加速、过渡时间函数、过渡结束回调事件
- java 获取 属性的注释(二)
- Java新手入门200例123之通过Java反射机制得到类的属性:继承的接口、父类、函数信息、成员信息、类型等
- CSS outline 属性
- CSS cursor 属性