0
看看这个例子 -上分度,伪elemets宽度100%之前和位置绝对
我需要div的绝对带位置:和后:前peseudo元素,但背景有错误: (
如何修复蓝色背景,它不带有红色背景重叠?
<div class="button_box">
<div class="blue_button"></div>
</div>
<br />
<div style="width: 200px; background: green;">i am 200px</div>
和CSS
.button_box {
width: 200px;
height: 29px;
position: relative;
}
.blue_button:after {
background: none repeat scroll 0 0 red;
border-radius: 0 12px 12px 0;
content: "";
display: block;
height: 29px;
position: absolute;
right: 0;
top: 0;
width: 12px;
}
.blue_button:before {
background: none repeat scroll 0 0 red;
border-radius: 12px 0 0 12px;
content: "";
display: block;
height: 29px;
left: 0;
position: absolute;
top: 0;
width: 12px;
}
.blue_button {
background: none repeat scroll 0 0 blue;
cursor: pointer;
height: 29px;
position: absolute;
width: 100%;
}
是,U正确理解。但如果背景图像呢?看看这个http://easycaptures.com/fs/uploaded/580/6649977625.jpg border-radius是个坏主意:( – user2164613 2013-03-21 20:22:28
我假设你正在做:before和after之后,因为按钮的宽度可以改变大小。 .. 你可以使用纯CSS而不是图像来制作该按钮吗? – Michael 2013-03-21 20:31:39
是的,它需要调整大小按钮......但我不能使它没有图像,因为它们具有纹理。 – user2164613 2013-03-21 20:39:11