css中的border-image-outset属性怎么用
更新:HHH   时间:2023-1-7


小编给大家分享一下 css中的border-image-outset属性怎么用,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!

  CSS3border-image-outset属性

  作用:规定边框图像超过边框盒的量。

  语法:

  border-image-outset:length|number;

  length:表示设置边框图像(border-image)与边框的距离,默认为0。

  number:代表相应的border-width的倍数。

  说明:

  1、border-image-outset属性规定边框图像超出边框盒的量,包括上下部和左右部分。如果忽略第四个值,则与第二个值相同。如果省略第三个值,则与第一个值相同。如果省略第二个值,则与第一个值相同。

  2、border-image-outset属性不允许使用任何负值。

  CSS3border-image-outset属性的使用示例

  <!DOCTYPEhtml>

  <html>

  <head>

  <metacharset="utf-8">

  <style>

  .box{

  width:600px;

  margin:100pxauto;

  border:1pxsolidred;

  }

  p{

  border:15pxsolid;

  padding:30px;

  border-image:url(1.jpg)100round;

  border-image-outset:1px10px8px;

  }

  </style>

  </head>

  <body>

  <divclass="box">

  <p>天达云</p>

  </div>

  </body>

  </html>

看完了这篇文章,相信你对“ css中的border-image-outset属性怎么用”有了一定的了解,如果想了解更多相关知识,欢迎关注天达云行业资讯频道,感谢各位的阅读!

返回web开发教程...