<p class="zw">有时候我们需要设置边框图像超出边框,这个时候使用<code>border-image-outset</code>属性就对了。最简单的方法是在各边均匀扩展<code>5px</code>。</p> <p class="图"><img alt="1409.tif" src="http://csdn-ebook-resources.oss-cn-beijing.aliyuncs.com/images/c4eeb42b07f54b42a9fd1568b8ec4b98/135.jpg"></p> <p class="图题">下方的边框比上方的边框扩展了5px。</p> <pre class="代码无行号"><code>.h-review { border-image-outset : 10px; }</code></pre> <p class="zw">当然,我们可以分别指定四个边框各自超出多少。</p> <pre class="代码无行号"><code>.h-review { border-image-outset : 10px 0 10px 0; }</code></pre> <p class="zw">同样的,重复的值可以合并起来,就想之前提到的内边距和外边距一样。</p> <pre class="代码无行号"><code>.h-review { border-image-outset : 10px 0; }</code></pre> <p class="zw"><code>border-image-outset</code> 属性可以接受任何常见的CSS长度值,包括<code>px</code>、<code>em</code>、<code>rem</code>,甚至是<code>vh</code>和<code>vw</code>。</p>