<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
* {
margin: 0
padding: 0
}
.demo {
margin: 0 0 0 100px
}
.img {
width: 200px
height: 200px
border: 1px solid #DCDCDC
padding: 5px
box-sizing: border-box
}
.img img {
width: 100%
height: 100%
}
.msg {
width: 200px
text-align: center
box-sizing: border-box
word-break: keep-all
white-space: nowrap
overflow: hidden
text-overflow: ellipsis
position: relative
border: 1px solid #000000
/*left: -30px你是不是布局出现了问题,如果你非要左移的话,去掉注释*/
}
</style>
<body>
<div class="demo">
<div class="img">
<img src="http://pic1.win4000.com/wallpaper/6/578855acae491.jpg" />
</div>
<div class="msg">
自驾游(多余的文字)<br> 会员价：
<strong style="color: red">9999元</strong>
</div>
</div>
</body>
</html>
background-position: top left 可以用负值您需要把 background-attachment 属性设置为 "fixed"，才能保证该属性在 Firefox 和 Opera 中正常工作
