我用html5 做了个手机网站 如何让图片本身100%放大

我用html5 做了个手机网站 如何让图片本身100%放大,第1张

html5页面加入这段

<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=2,user-scalable=no"/>

maximum-scale=2 表示页面最大放大2倍,这样你只要双击图片就可以实现放大了,如果是要js来实现的话 那就得写拖动插件了。 原理:先改变图片那个div的宽度为2倍然后定义那个div为绝对定位,这个div可以拖动(需要js来监听处理对应的函数)

所以简单的做还是就用浏览器自带的放大功能

光有meta头是不够的,图片、表格等等任意一个自定义宽或者自动宽的元素都可以把你的界面撑开,如果简单点处理,可以强制给img和table标签加max-width:100%处理,html标签加width:100%overflow:hidden

html5输入框左边有一个放大镜图标,右边有按钮点击触发搜索的代码如下:

1.HTML5的特性

语义特性

HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的,微数据与微格式等方面的支持,构建对程序、对用户都更有价值的数据驱动的Web。

本地存储特性

基于HTML5开发的网页APP拥有更短的启动时间,更快的联网速度,这些全得益于HTML5 APP Cache,以及本地存储功能。

设备兼容特性

从Geolocation功能的API文档公开以来,HTML5为网页应用开发者们提供了更多功能上的优化选择,带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连,例如视频影音可直接与microphones及摄像头相联。

2.html5的优点:

提高可用性和改进用户的友好体验;

有几个新的标签,这将有助于开发人员定义重要的内容;

可以给站点带来更多的多媒体元素(视频和音频);

可以很好的替代FLASH和Silverlight;

涉及到网站的抓取和索引的时候,对于SEO很友好;

将被大量应用于移动应用程序和游戏。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6246618.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-19
下一篇 2023-03-19

发表评论

登录后才能评论

评论列表(0条)

保存