HTML页面缩小后显示滚动条的示例代码

发布时间:2021-05-14 14:20:32
    文章主要介绍了HTML页面缩小后显示滚动条的示例代码,对大家的学习或工作具有一定的参考借鉴价值哦。 
    这里记录一下如何使得HTML页面缩小之后,底部出现滚动条,使得可以通过滚动滚动条来浏览由于界面缩小而被掩盖的地方。
说一下这样做的好处。
首先,一般界面缩小之后不出现滚动条,用户就不能访问被隐藏的地方,必须使得界面变大才可以。
其次,有些界面由于相对或者绝对的布局,随着界面的变小,会出现右边的界面变到下面的现象,很可能会使得界面排布变得不美观,最省心的方法便是缩小后显示滚动条。
实现很简单,几行代码
    body{
    min-width: 1200px
    overflow: scroll
    /*max-width:100%;*/
}
    知识点扩展:
    html页面缩小后自动出现滚动条
    导入这个style就行了,主要按需求设置一下body里面的属性。
    body{
  margin:0px;
  width:100%;
  min-width:1500px;
  max-width:100%;
  height:100%;
  background-color:#F0F0F0;
}
    #head{
  background-color:#FFFF00;
  width:100%;
  height:100px;
}
    #center{
  background-color:#00FFFF;
  width:100%;
  min-height:100%;
}
    #foot{
  background-color:#FF00FF;
  width:100%;
  height:100px;
}
    到此这篇关于HTML页面缩小后显示滚动条的示例代码的文章就介绍到这了,更多相关html页面缩小显示滚动条内容请关注我们!