问题描述
我不知道这是否可能与CSS,但它是值得问。
我想有一个在其中有格式文本的中间(空心)和一个小的图像透明的梯形。它也必须响应。这里是我的意思模型:
这是否适合CSS?我知道如何做一个梯形的形状,但我还没有想出如何得到文本内部,它是中空的(只有形状的轮廓)。
如果 width
/ height
的梯形应动态更改,您可以通过使用如下:
.box {width:300px; / *可选 - 随意删除它* / / * height:150px; * / / *可选 - 随意删除它* / position:relative; padding:5px;}。box:before {content:; position:absolute; border:3px solid teal;顶部:-4%;底部:-11%;左:-3%;右:-3%; z-index:-1; -webkit-transform:perspective(50em)rotateX(-30deg); transform:perspective(50em)rotateX(-30deg);}
< div class =box> Lorem ipsum dolor sit amet,consectetur adipisicing elit。 < / div>