找回密码
 加入怎通
查看: 263|回复: 3

浅谈移动前端web建设——meta标签的作用(web的每一页都有一个独立网址)

[复制链接]
我来看看 发表于 2023-03-09 12:51:06 | 显示全部楼层 |阅读模式
) K7 x) v: c: u8 s* `5 ]% c$ E6 J" }

meta标签位于head标签之间是主要辅助HTML结构层的,他对对前端有这很重要,但是面对pc前端web、移动前端的重要性,还是有区别那么移动端的meta标签有什么不一样,看如下文章:附上代码进行说明:。

% y: l. i) \" I( {- T

xxx

. c1 x* }1 J, A1 y

这是一个HTML5为语言标准的说明文档第一组meta标签,大家比较常见这个是经常用到的它表明的意思是它的内容是html文档,且网页编码采用的是utf-8编码utf-8编码主要针对是简体中文和英文正确的编码定义很有必要。

# ]. e3 \7 a9 m% c- h

否则会导致网页上的文字变成乱码 第二组meta标签就是移动端特属的标签了它表明的意思是它是一个视图窗口其视图窗口内容的宽度等于移动端设备的默认宽度inital-scale表示的初始的缩放比例.一般设置为1.0倍。

1 F; X# q% @6 C4 Z8 W

maximum-scale=1.0表示的允许用户缩放的最大比例user-scalable=no表示是否支持用户手动进行缩放 第三组和第四组meta标签都是针对IOS系统的专属标签第三组meta标签表示的意思是是否启动webapp功能。

. P+ _/ v e5 k+ x$ V5 i" p

说通俗一点就是当点击网页添加至主屏幕功能时,会在主屏幕上生成一个图标点击该图标会进入webapp功能就是模拟本地应用的模式来浏览web页面生成的图标可以自定义,启动webapp时的开始时的图片也可以定义。

$ a- E( z" F) T7 S5 k7 e

这个是link标签的作用,我会在介绍link标签时,单独进行说明 第四组meta标签表示的是当启动webapp功能时,显示手机信号、时间、电池的顶部导航栏的颜色默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)。

% e& ]" S, M& l, [

这个主要是根据实际的页面设计的主体色为搭配来进行设置文/丁向明做一个有博客的web前端自媒体人,专注web前端开发,关注用户体验,加我qq/微信交流:6135833http://dingxiangming.com

5 d4 a5 m+ s) Z8 v- d, w4 L _7 h; Z, C$ Y5 e! [ # N, W( t4 W2 o# s1 ?) Y ' ]: u5 b) ?3 W$ {* o9 f0 v. X 7 y A+ `% a: r2 J" p+ w

暂时无法加载帖子列表

回复

使用道具 举报

长沙seo 发表于 2026-03-14 19:48:20 | 显示全部楼层
学习到了,之前一直没注意过这个点,受教了
回复

使用道具 举报

天猫巴士 发表于 2026-09-18 23:50:42 | 显示全部楼层
蹲了这么久,终于看到有价值的讨论,支持一下!
回复

使用道具 举报

西万路小混混 发表于 2026-09-19 00:44:36 | 显示全部楼层
楼主辛苦了,整理这么多内容,必须点赞收藏
回复

使用道具 举报

    您需要登录后才可以回帖 登录 | 加入怎通

    本版积分规则

    QQ|手机版|小黑屋|网站地图|真牛社区 ( 苏ICP备2023040716号-2 )

    GMT+8, 2026-9-19 01:23 , Processed in 0.041858 second(s), 25 queries , Gzip On.

    免责声明:本站信息来自互联网,本站不对其内容真实性负责,如有侵权等情况请联系420897364#qq.com(把#换成@)删除。

    Powered by Discuz! X3.5

    快速回复 返回顶部 返回列表