使用 CSS 设置边框样式
javascriptweb developmentfront end scripts
要设置边框样式,请使用 border-style 属性。 border-style 属性允许您选择以下边框样式之一:
- none:无边框
- solid:边框是一条实线。
- dotted:边框是一系列点。
- dashed:边框是一系列短线。
- double:边框是两条实线。
- groove:边框看起来好像是刻在页面上的。
- ridge:边框看起来与 groove 相反。
- inset:边框使框看起来像是嵌入在页面。
- outset:边框使框看起来像是从画布中伸出的。
- hidden:与 none 相同,但表格元素的边框冲突解决方面除外。
示例
您可以尝试运行以下代码来设置边框的样式:
<html> <head> </head> <body>. <p style = "border-width:4px; border-style:none;"> This is a border with none width. </p> <p style = "border-width:4px; border-style:solid;"> This is a solid border. </p> <p style = "border-width:4px; border-style:dashed;"> This is a dashed border. </p> <p style = "border-width:4px; border-style:double;"> This is a double border. </p> <p style = "border-width:4px; border-style:groove;"> This is a groove border. </p> </body> </html>