如何将边框图像放在div内[重复]

Posted

技术标签:

【中文标题】如何将边框图像放在div内[重复]【英文标题】:how to put border image inside of div [duplicate] 【发布时间】:2015-05-01 07:45:52 【问题描述】:

使用border-image CSS 属性时,边框位于div 之外。有什么办法可以把边框图片放到div里面?

border-width: 50px;
border-image: url(Border.png) 50 repeat;

【问题讨论】:

不,它不适用于边框图像 【参考方案1】:

Codepen link

你是这个意思吗?

HTML

<div>
 <span>

 </span>
</div>

CSS

div 
  border: 1px solid black;
  width: 200px;
  height: 200px;


span 
  box-sizing: border-box;
  display: block;
  width: 200px;
  height: 200px;
  border-width: 50px;
  border-image: url(https://www.castlejackpot.com/wp-content/uploads/dynamik-gen/theme/images/home-horizontal-border.png) 50 repeat;

【讨论】:

以上是关于如何将边框图像放在div内[重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何将按钮的底部边框(白色)放在包含 div 的底部边框上

如何将 UIView 的边框放在 UIImage 后面?

如何将h1放在图像上[重复]

如何将边框图像添加到动态创建的图像?

带有边距的图像内的边框[重复]

使用CSS的图像内边框?