css 复古信封主题边框通过边框图像

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了css 复古信封主题边框通过边框图像相关的知识,希望对你有一定的参考价值。

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
// alert('Hello world!');
<div>Bacon ipsum dolor amet eu adipisicing elit tongue ground round ex fatback proident kielbasa ham hock. Sausage beef beef ribs aliquip t-bone mollit. Quis beef tri-tip sunt, cupim ut magna salami t-bone. Ut laboris bresaola ribeye biltong landjaeger. Chuck pork belly sed sausage.</div>
/**
 * Vintage envelope themed border via border-image
 */

div {
	padding: 1em;
	border: 16px solid transparent;
	border-image: 16 repeating-linear-gradient(-45deg, red 0, red 1em, transparent 0, transparent 2em,
	              #58a 0, #58a 3em, transparent 0, transparent 4em);
	
	max-width: 20em;
	font: 100%/1.6 Baskerville, Palatino, serif;
}

以上是关于css 复古信封主题边框通过边框图像的主要内容,如果未能解决你的问题,请参考以下文章

css CSS3边框:圆角,阴影,边框图像等

条纹边框,如示例图像 css

HTML/CSS 如何删除特定图像的边框?

从图像上的 alt 标记文本中删除边框

使用CSS的图像内边框?

CSS a:悬停图像边框