`

Border style的使用

阅读更多
使用方法:

div{
    border:1px solid #000
}

代表一个黑色边框

border-style : none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset 
  
参数: 
  
none :  无边框。与任何指定的border-width值无关 
hidden :  隐藏边框。IE不支持 
dotted :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线 
dashed :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线 
solid :  实线边框 
double :  双线边框。两条单线与其间隔的和等于指定的border-width值 
groove :  根据border-color的值画3D凹槽 
ridge :  根据border-color的值画菱形边框 
inset :  根据border-color的值画3D凹边 
outset :  根据border-color的值画3D凸边 
  
说明: 
  
如果提供全部四个参数值,将按上-右-下-左的顺序作用于四个边框。 
如果只提供一个,将用于全部的四条边。 
如果提供两个,第一个用于上-下,第二个用于左-右。 
如果提供三个,第一个用于上,第二个用于左-右,第三个用于下。 
要使用该属性,必须先设定对象的height或width属性,或者设定position属性为absolute。 
如果border-width不大于0,本属性将失去作用。 
对应的脚本特性为borderStyle。请参阅我编写的其他书目。 
分享到:
评论

相关推荐

    第二章,Label 控件[Caption(标题)属性][BorderStyle(边框)属性]

    在实际应用中,Caption和BorderStyle属性的组合使用可以创造出各种效果。比如,可以创建一个带有边框的警告Label,Caption设置为“注意!”并使用Bold字体,BorderStyle设为Fixed3D,这样的设计既能明确传达重要信息...

    border虚线样式(style)

    通过组合使用`border-style`, `border-width`, 和 `border-color`,你可以根据需要定制边框的样式。同时,通过一些创意技巧,比如多边框叠加和伪元素,还可以实现更复杂的虚线效果。在实际开发中,理解并熟练运用...

    JavaScript CSS Style属性对照表

    - `borderStyle` - `borderTop` - `borderTopColor` - `borderTopStyle` - `borderTopWidth` - `borderWidth` **2. 浮动与清除属性** - **CSS属性**: - `clear` - `float` - **JavaScript属性**: - `...

    CSS border-style 属性使用方法

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

    border虚线样式,带颜色

    如果你希望边框的不同部分具有不同颜色,可以使用border-top-color、border-right-color、border-bottom-color和border-left-color单独设置每个边的颜色。 ```css element { border-top-color: green; border-...

    css border 虚线的使用方法.docx

    CSS border 虚线的使用方法 ...通过使用 border-style、border-width、border-color 和 border 属性,可以创建各种不同的虚线边框样式。此外,使用 border-image 属性还可以设置更复杂的边框样式。

    Have you ever wanted to change the border style during runti

    Have you ever wanted to change the border style during runtime? Now you can using SetWindowLong. This example demonstrates greatly how you can accomplish this.

    解决border-radius失效问题

    border-style: solid; /* 显示实线边框 */ } ``` 3. **透明边框**:即使边框样式是可见的,如果边框颜色是透明的,`border-radius`也可能无法显现。设置非透明的边框颜色来解决这个问题。 ```css div { border-...

    wpf border 边框不同颜色

    在WPF中,通常我们使用`Border`控件来添加边框,并通过`BorderBrush`属性来设置边框颜色。然而,如果要为Border的四个不同侧面设置独立的颜色,就需要使用一些技巧。描述中提到的"leftborderbrush"等属性,并非是WPF...

    CSS border.docx CSS border.docx

    此外,border-style 属性还可以与其他边框属性结合使用,例如 border-color、border-radius 等,来创建更加复杂的边框样式。 border-style 属性是 CSS 中一个非常重要的属性,它可以帮助开发者创建各种复杂的边框...

    拼图游戏(3*3)

    pictureBox10.BorderStyle = pictureBox1.BorderStyle; pictureBox1.BorderStyle = pictureBox2.BorderStyle; pictureBox2.BorderStyle = pictureBox10.BorderStyle; } if (n1 == 4) { pictureBox10....

    QT使用border-image实现9宫格效果

    接下来,我们将在QT的QSS(Qt Style Sheets)中使用`border-image`属性。QSS类似于HTML的CSS,用于控制QT界面的样式。以下是一个基本示例: ```css QPushButton { border-image: url(:/testImage) stretch; } ``` ...

    div style属性中设置其border无效是什么情况如何解决

    `style` 属性则允许我们直接在元素内定义CSS样式,包括设置边框(border)。...在编写时,记住始终指定`border-style`、`border-width` 和 `border-color`,或使用简写形式`border`,以确保边框的正确显示。

    table中的border-collapse属性

    在网页设计中,特别是在使用`table`元素进行布局时,`border-collapse`属性的使用极为关键。例如,在默认情况下,即未明确指定`border-collapse`属性时,浏览器会将其视为`separate`,这可能导致表格看起来较为臃肿...

    vant+vue初始化移动端项目,border样式重置:border.css

    vant+vue初始化移动端项目,border样式重置:border.css

    border虚线(带你了解冷门却实用的特性)

    `border-style`接受多种预定义的值,如`solid`(实线)、`dashed`(虚线)和`dotted`(点线)。要创建虚线边框,只需要将`border-style`的值设置为`dashed`即可。例如: ```css div { border-style: dashed; } ```...

    Black&White

    《Black&White》是一款经典的人工智能与玩家对战的黑白子游戏,它以其独特的策略性和高度的智力挑战性吸引了众多玩家。在这个游戏中,玩家需要通过巧妙布局和精确的判断来与计算机进行对弈,争夺棋盘上的优势,最终...

    Border属性的终极研究(原创:冰极峰)

    除了`border`简写属性,还可以分别设置`border-width`、`border-style`和`border-color`,以及单独控制每个边的属性,如`border-left`、`border-right`等。 了解了基础后,我们可以探索更复杂的用法。比如,使用`...

Global site tag (gtag.js) - Google Analytics