CSS 基础学习-047 使用border-color 属性设置边框颜色

hrs 提交于 2021/09/04 - 07:26 , 周六

border-color 属性用于设置四个边框的颜色

实例代码:

<!doctype html>
<html>
  <head>
    <title>border-color 颜色属性</title>
    <meta charset="utf-8">
    <style>
    p{
      width:300px;
    } 

      .border1{
          border-style:solid;
          border-color:red;
      }


      .border2{
          border-style:solid;
          border-color:green;
      }
      .border3{
          border-style:dashed;
          border-color:blue;
      }
    </style>
  </head>
  <body>
    <h1>border-color 属性</h1>
    <p>border-color 设置边框颜色</p>
    <p class="border1">这是一个红色的边框</p>
    <p class="border2">这是一个绿色的边框</p>
    <p class="border3">这是一个蓝色点状边框</p>
  </body>
</html>

运行效果:

css-047.png

标签