欢迎光临
我们一直在努力

css中的border-color属性怎么用?

这篇文章主要介绍css中的border-color属性怎么用?,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

  CSSborder-color属性

  作用:border-color属性用于设置一个元素边框颜色,可以设置1~4个值:

  border-color:redgreenbluepink;

  ●上边框是红色

  ●右边框是绿色

  ●下边框是蓝色

  ●左边框是粉红色

  border-color:redgreenblue;

  ●上边框是红色

  ●左,右边框是绿色

  ●下边框是蓝色

  border-color:redgreen;

  ●上、下边框为红色

  ●左、右边框为绿色

  border-color:red;

  ●所有四个边框都为红色

  注:需要在border-color属性之前声明border-style属性的,因为元素必须在改变其颜色之前获得边框。且border-style属性的值不能为none或hidden,否则边框不会出现,border-color属性无法生效。

  CSSborder-color属性的使用示例

  <!DOCTYPEhtml>

  <html>

  <head>

  <metacharset="utf-8">

  <title>php中文网(php.cn)</title>

  <styletype="text/css">

  p.one

  {

  border-style:solid;

  border-color:#0000ff

  }

  p.two

  {

  border-style:solid;

  border-color:#ff0000#0000ff

  }

  p.three

  {

  border-style:solid;

  border-color:#ff0000#00ff00#0000ff

  }

  p.four

  {

  border-style:solid;

  border-color:#ff0000#00ff00#0000ffrgb(250,0,255)

  }

  </style>

  </head>

  <body>

  <pclass="one">一个蓝色边框!</p>

  <pclass="two">一个彩色边框!</p>

  <pclass="three">一个彩色边框!</p>

  <pclass="four">一个彩色边框!</p>

  <p><b>注:</b>"border-width"属性如果单独使用的话是不会起作用的。请首先使用"border-style"属性来设置边框。</p>

  </body>

  </html>

以上是“css中的border-color属性怎么用?”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注云搜网行业资讯频道!

赞(0)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。