Question

我想问一下

我有一个全屏幕的脚本，位置固定但不完整

这是截图：

我的代码：

＆＃13;

    .affix{bottom:-1px; width: 100%; display:block; background-size: cover !important; position:fixed !important; z-index: 9999 !important;}

＆＃13;

    <div class="affix" style="background-color:#43A047; margin-top:-1px;">
    <a href="http://myweb.com" target="_blank"><center><h3 style="color:#ffffff; padding:8px; margin:0px;"><i class="fa fa-pencil-square-o"></i> CLICKED...</h3></center></a>
    </div>

＆＃13;

Answer 1

尝试设置left:0和width:100vw;

这是JSFiddle：https://jsfiddle.net/a1b5qoj0/5/

了解vw： https://css-tricks.com/viewport-sized-typography/

.affix{
bottom:-1px; 
width:100vw; 
display:block; 
background-size: 
cover !important; 
position:fixed !important; 
z-index: 9999 !important;
left:0
}

<div class="affix" style="background-color:#43A047; margin-top:-1px;">
<a href="http://myweb.com" target="_blank">
<center>
<h3 style="color:#ffffff; padding:8px; margin:0px;">
<i class="fa fa-pencil-square-o">
</i> CLICKED...
</h3>
</center>
</a>
</div>

Answer 2

您需要重置CSS：

* { padding: 0px; margin: 0px;}

bootstrap背景大小封面未满

2 个答案: