html – 我的div大于窗口的宽度

发布时间：2020-12-14 16:35:19 所属栏目：资源来源：网络整理

导读：这是我的div的css.我希望背景能够填满整个屏幕,但它比我的屏幕分辨率更大,所以会出现一个底部滚动条 .hero-unit { padding:60px; margin-top: 60px; background: url("../img/bar2.jpg") no-repeat scroll 0; height:233px; width:100%; left:0px; backgroun

这是我的div的css.我希望背景能够填满整个屏幕,但它比我的屏幕分辨率更大,所以会出现一个底部滚动条

.hero-unit {
  padding:60px;
  margin-top: 60px;
  background: url("../img/bar2.jpg") no-repeat scroll 0;
  height:233px;
  width:100%;
  left:0px;
  background-size: cover;
  position:absolute;
  background-color:#eeeeee;
}

解决方法

您可以使用box-sizing

-webkit-box-sizing: border-box; /* Safari/Chrome,other WebKit */
-moz-box-sizing: border-box;    /* Firefox,other Gecko */
box-sizing: border-box;

这使得当您添加填充,边距或边框时,它不会影响宽度. (这不适用于IE7及以下版本)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!