层楼箭头设置background-position不现实是什么情况
<div class="floor"> <!--层楼标题--> <div class="floor-1"> <p style="color: #fff;width: 30px;height: 30px;line-height:30px;border-radius: 50%;background: #000;text-align: center;display: inline-block;">1F</p> <p style="font-weight: bold;display: inline-block;">服装鞋包</p> <span class="floor-jt">大牌</span> <span>男装</span> <span>女装</span> </div> <!--层楼内容--> <div> </div> </div>
/*层楼设置*/
.floor{
width: 1188px;
margin-left:15%;
}
.floor-1{
margin-top: 100px;
padding-bottom: 5px;
border-bottom: 1px solid red;
overflow:hidden;
}
.floor-1 span{
float: right;
margin: 0 10px;
}
.floor-jt{
background-image: url('floor-arrow.png');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 50% 100%;
}我去掉
background-repeat: no-repeat;
这个属性他会背景重复，说明图片位置没问题，可是加上他图片又看不到了，怎么回事？
14
收起
正在回答 回答被采纳积分+1
3回答
怎么都被占用了呢
2018-01-24 18:00:46
帮你修改了下css，请参考：
<style type="text/css">
/*层楼设置*/
.floor{
width: 1188px;
margin-left:15%;
}
.floor-1{
margin-top: 100px;
/*padding-bottom: 5px;*/
border-bottom: 1px solid red;
/*overflow:hidden;*/
height:64px;
}
.floor-1 span{
float: right;
margin: 0 10px;
height:65px;
}
.floor-jt{
background-image: url('floor-arrow.png');
background-repeat: no-repeat;
background-position: 50% 100%;
}
</style>
相似问题
登录后可查看更多问答，登录/注册
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星