css - CSS有图像从div边缘突出

Question

#col{
width:200px; 
float:left;
overflow:visible;
position:relative;
z-index:2;
}

<div id="col">

<img style="margin-left:-6px; z-index:999; position:relative;"  src="img.jpg" />
</div>

我希望图像向左突出 6px，但它被切断了。

我还必须在每行代码的字体中放置 4 个空格，这非常慢！

Answer 1

您的图像被截断，因为您在父母身上使用了溢出div#col

<div id="col">
  <img src="img.jpg" alt="some info">
</div>

CSS

#col{
width:200px; 
float:left;
position:relative;
/*overflow: visible;*// remove
/*z-index:2;*// no need to do that
}
#col img {
position: absolute;
top: 0;
left: -6px;
width: width of image in px;
height: height of image in px;
}

Answer 2

这是你要找的吗？

http://jsfiddle.net/qPhba/