失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > html自动缩放不出现滚动条 HTML页面缩小后显示滚动条的示例代码

html自动缩放不出现滚动条 HTML页面缩小后显示滚动条的示例代码

时间:2021-10-09 01:01:39

相关推荐

html自动缩放不出现滚动条 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页面缩小显示滚动条内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!

如果觉得《html自动缩放不出现滚动条 HTML页面缩小后显示滚动条的示例代码》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。