html - 标题背景直到屏幕末尾才展开

Question

这是网站的截图。电脑浏览器显示很好，但手机 opera 和其他浏览器显示不佳。

我错过了什么？

#header{
    background: -webkit-linear-gradient(180deg,#307FB7, #084F81);
    background: -moz-linear-gradient(180deg,#307FB7, #084F81);
    background: -ms-linear-gradient(180deg,#307FB7, #084F81);
    background: -o-linear-gradient(180deg,#307FB7, #084F81);
    background: linear-gradient(180deg,#307FB7, #084F81);


    -webkit-box-shadow: 0 1px 2px #000000;
    -moz-box-shadow: 0 1px 2px #000000;
    box-shadow: 0 1px 2px #000000;
}

#header-wrapper{
    height: 80px;
    margin: auto; /* Centralize blue bar */
    width: 996px; /* Fix the size of blue bar */
}

Answer 1

我还不能发表评论，但为什么你有 width:996px;？

如果您在浏览器上需要它的宽度，请使用 max-width: 996px; 和 width:100%;

这样在移动设备中，条形图将占屏幕的 100%，但在浏览器中它将是 100%，直到达到最大值 996px。