我试图在同一行中按此顺序对齐hr标签,图像和hr标签。
到目前为止我的代码
<div class="arrow">
<hr class="left">
<img src="http://bit.ly/100X8XQ" height="10" width="10">
<hr class="right">
<div>
CSS:
.arrow {
margin-top: 20px;
}
.left {
martin-left: 20px;
}
img {
display: inline-block;
}
.right {
martin-right: 20px;
}
我尝试在多个地方使用display:inline块,但无法使其正常工作。有办法解决吗?
您可以在图像上设置负边距
演示http://jsfiddle.net/ceobm2he/2/
img{
display: block;
margin:-6px auto 0 auto;
}
.left {
margin:0 20px;
}
如果要在图像周围留一些空间,请添加一些填充和背景样式
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句