<style type="text/css"> body { 580px; } div { text-align:center; } img { display:block; } span { text-align:left; display:inline-block; } </style> <div><img/><span>文本内容一</span></div> <div><img/></span>文本内容二</div>
如上,当文本内容一很多少时候会居左显示,而文本内容比较少的时候会居中显示
这里用到了外层div居中,而内层span居左,我bug了一下居左并没有作用。所以要加上display-inlineblock才会实现如上效果