HTML页⾯缩⼩后显⽰滚动条的⽰例代码
这⾥记录⼀下如何使得HTML页⾯缩⼩之后,底部出现滚动条,使得可以通过滚动滚动条来浏览由于界⾯缩⼩⽽被掩盖的地⽅。
说⼀下这样做的好处。
⾸先,⼀般界⾯缩⼩之后不出现滚动条,⽤户就不能访问被隐藏的地⽅,必须使得界⾯变⼤才可以。
其次,有些界⾯由于相对或者绝对的布局,随着界⾯的变⼩,会出现右边的界⾯变到下⾯的现象,很可能会使得界⾯排布变得不美观,最省⼼的⽅法便是缩⼩后显⽰滚动条。
实现很简单,⼏⾏代码
body{html横向滚动条样式
min-width: 1200px;
overflow: scroll;
/*max-width:100%;*/
}
知识点扩展:
html页⾯缩⼩后⾃动出现滚动条
导⼊这个style就⾏了,主要按需求设置⼀下body⾥⾯的属性。
<style>
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;
}
</style>
到此这篇关于HTML页⾯缩⼩后显⽰滚动条的⽰例代码的⽂章就介绍到这了,更多相关html页⾯缩⼩显⽰滚动条内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章,希望⼤家以后多多⽀持!
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论