CSS边框属性用法示例

2021年4月9日16:46:18 发表评论 796 次浏览

CSS中的border属性用于设置元素边框的样式。此属性是其他三个属性的组合边框宽度, 边框样式和边框颜色可以用作这三个属性的简写形式。它设置或返回border-width, border-style, border-color属性。

语法如下：

border = "width style color|initial|inherit"

boder值:

宽度：此值指定边框的粗细或宽度。
风格：此值指定边框的样式, 即边框是否将是虚线, 虚线, 实线等。
颜色：此值指定边框的颜色。

下面的代码说明了CSS中的border属性：

例子：

<!DOCTYPE html>
<html>
  
<head>
     <title>
         CSS | border Property
     </title>
     <style>
         h1 {
             color: green;
         }
          
         #gfg {
             border: 4px solid blue;
             width: 60%;
         }
     </style>
</head>
  
<body>
     <center>
         <h1>lsbin</h1>
  
         <h2>DOM Style border Property</h2>
  
         <!-- Element whose border will be styled -->
         <div id = "gfg">
             lsbin. 
             It is a computer science portal for geeks.
         </div>
     </center>
</body>
  
</html>

输出如下：