html 实现网页单屏显示 满屏显示,不出现滚动条。

就是再不同显示器下 都是满屏显示内容,不出现滚动条,请给个详细的例子。谢谢。

1、打开html开发工具,新建一个html代码页面,在html代码页面输入大量的文本内容,确保在浏览器上能有滚动条出现。

2、引入一个jquery.js库。在title标签后面创建一个script标签,然后引入jquery.js文件。

3、新建一个script标签,在这个标签里面创建使用$(window).scroll()监听滚动条滚动事件(案例中判断当滚动条滚动高度超过100的时候就出现一个弹出框)。

4、保存html代码后使用浏览器打开,然后滚动Y轴滚动条。

5、发现滚动到一定位置后会出现一个alert弹出框表示监听滚动条成功。



扩展资料  


HTML称为超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。

HTML文本由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。 

超文本是一种组织信息的方式,它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中,也可能是其他文件,或是地理位置相距遥远的某台计算机上的文件。

这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接,为人们查找,检索信息提供方便。

HTML其实是文本,它需要浏览器的解释,它的编辑器大体可以分为以下几种:

基本文本、文档编辑软件,使用微软自带的记事本或写字板都可以编写,WPS来编写,也可以。不过存盘时请使用htm或html作为扩展名,这样就方便浏览器认出直接解释执行了。

半所见即所得软件,如:FCK-Editer、E-webediter等在线网页编辑器;尤其推荐:Sublime Text代码编辑器(由Jon Skinner开发,Sublime Text2收费但可以无限期试用)。

所见即所得软件,使用最广泛的编辑器,完全可以一点不懂HTML的知识就可以做出网页,如:AMAYA(出品单位:万维网联盟)。

任何地方进行修改只需要刷新即可显示。缺点是生成的代码结构复杂,不利于大型网站的多人协作和精准定位等高级功能的实现。

温馨提示:答案为网友推荐,仅供参考
第1个回答  2019-07-21

1、打开html开发工具,新建一个html代码页面,在html代码页面输入大量的文本内容,确保在浏览器上能有滚动条出现。

2、引入一个jquery.js库。在title标签后面创建一个script标签,然后引入jquery.js文件。

3、新建一个script标签,在这个标签里面创建使用$(window).scroll()监听滚动条滚动事件(案例中判断当滚动条滚动高度超过100的时候就出现一个弹出框)。

4、保存html代码后使用浏览器打开,然后滚动Y轴滚动条。

5、发现滚动到一定位置后会出现一个alert弹出框表示监听滚动条成功。

本回答被网友采纳
第2个回答  推荐于2017-09-20

请搜索 响应式布局

<!--例子:
<!--这个站打开后调整浏览器宽度,网页宽度自动变化,足够小时,关闭右侧栏目-->
<!--响应式布局是移动端 各种尺寸不同的平板/手机 浏览网页的解决方案 -->
<!--简单的用法就是width:100%这样,外层元素百分比化,并设置最大width:max-width:960px这样-->

---------------

页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成,包括弹性网格和布局、图片、CSS media query的使用等。无论用户正在使用笔记本还是iPad,我们的页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等,以适应不同设备;换句话说,页面应该有能力去自动响应用户的设备环境。响应式网页设计就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这样,我们就可以不必为不断到来的新设备做专门的版本设计和开发了。

追问

我知道 和了解响应式~我现在只想在PC端用兼容 主流的1366x768,1920X1280.等。
也不需要流布局处理组件,我写了100%之后 F12调试的 时候 div 的高度 会缩水 (高度我写的是 height:10%)。。。。有没有这样的 啊是不是 必须使用js 获取 浏览器的 高度,,,

追答

F12 会占用浏览器高度,不是覆盖式
你可以点击F12 审查元素 右上叉号左边那一个按钮(undock into separate window) 让审查元素生成独立窗口就不要占用 窗口高度了
-------js---------
屏幕分辨率的高:window.screen.height
屏幕分辨率的宽:window.screen.width

本回答被提问者采纳
第3个回答  2014-12-05
body{height:100%; width:100%; overflow:hidden;}

相关了解……

你可能感兴趣的内容

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 非常风气网