当前位置: 首页 > Web前端 > HTML

HTML中meta属性的作用

时间:2023-04-02 20:23:16 HTML

在写前端页面的时候,经常忽略meta标签的功课,只是习惯性的贴一些常用的代码。许多人不了解元还有许多其他用途。以下是我的部分安排。meta标签的构成:meta标签原本有两个属性,分别是http-equiv属性和name属性。后来h5发布了一个新的属性charset;每个属性都有不同的参数值,这些不同的参数值实现了。不同的网页功能;下面介绍一下属性;charset(h5的新增属性)charset属性规定了HTML文档的字符编码;属性必须包含在html中;名称属性;name属性主要用于描述网页,属性值为content,content中的内容在SEO中经常用到。。Keywords(关键词)keywords是用来告诉搜索引擎这个页面的关键词是什么,主要是SEO优化的内容描述)description是用来告诉搜索引擎网站的主要内容,用简短和简短的描述来描述网站通用文本,也主要用于SEO优化。robots(机器人向导)robots用于告诉搜索机器人哪些页面需要被索引,哪些页面不需要被索引。具体参数如下:information参数为all:可以检索文件,页面上的链接可以查询;information参数为none:无法检索文件,无法查询页面上的链接;information参数为index:文件将被检索;information参数如下:可以查询页面上的链接;information参数为noindex:不搜索文件,但可以查询页面上的链接;information参数为nofollow:可以检索文件,但无法查询页面上的链接;author(网页的开发者)标记网页的开发者;例如:viewport(控制页面是否可以缩放,主要用在移动端)在移动端的布局中,css中的1px不等于物理的1px,现在手机屏幕的分辨率越来越高,高像素但是屏幕尺寸变化不大,也就是说一个物理像素其实是被打包成了几个像素。所以在做移动端开发的时候,为了在不同的手机上显示相同大小的移动端页面,我们可以固定页面的宽度,然后获取设备的宽度,可以获取到我们之前设置的宽度和设备宽度比例,然后使用HTML5新视口缩放页面,并修复不允许用户重新缩放。参数详细解释如下如下:width设置layout视口的宽度,为正整数,使用字符串"width-device"表示设备宽度initial-scale设置页面的初始缩放值,为数字,可以有adecimalminimum-scale用户允许的最小缩放值,是一个数字,可以有一个小数maximum-scale用户允许的最大缩放值,是一个数字,可以有一个小数user-scalable是否允许usertozoom,value是"no"或"yes",no表示不允许,yes表示允许重访-afterrevisit-after参数表示网站多久后被重访,1days代表1天,以此类推。generator参数,代表用什么软件做网站。COPYRIGHTCOPYRIGHT信息参数表示本网站的版权信息。http-equiv属性http-equiv可以向浏览器返回一些有用的信息,帮助正确准确的显示网页内容,对应的属性值为content;meta标签的http-equiv属性语法格式为:******http-equiv属性有如下参数:Expires(period)用于设置网页的过期时间。时间一到,网页自动失效,页面必须重传给服务器。***注意:必须使用GMT时间格式。***Pragma(缓存模式)Pragma禁止浏览器从本地计算机的缓存中访问页面内容,每次加载页面都是从web服务器加载;使用此设置,访问者将无法离线浏览,必须在在线状态下浏览页面;******Refresh(设置自动刷新)设置页面等待时间长后自动刷新页面或指向新页面,跳转页面。***//(注意后面的引号,分别是秒前和后URL,这个例子是10秒后跳转)***Set-Cookie(cookiedelete)当网页过期时,会自动删除本地电脑中的cookie。***注意:必须使用GMT时间格式。***Window-target(设置显示窗口的默认设置)强制改变页面在当前窗口的显示方式为独立显示,可以用来防止别人在框架中调用自己的页面。******content-Language(显示语言设置)meta其他忽略的号码自动识别为电话号码忽略识别邮箱WebApp(全屏模式:假应用、离线应用)。******移动端的元用法HTML标签是默认的所有页面链接:例如:******标签就是所有的有指定默认地址或默认目标的链接指定页面所有链接的默认打开方式(类似于meta的Window-target):例如:******target指定页面上的所有链接在此页面上打开的所有选项卡