Skip to content

[html] 第98天 列举出你最常用的meta标签的写法和作用 #971

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

第98天 列举出你最常用的meta标签的写法和作用

Activity

dondonZh

dondonZh commented on Jul 23, 2019

@dondonZh
禁止缓存 和不允许用户缩放
xiangshuo1992

xiangshuo1992 commented on Jul 23, 2019

@xiangshuo1992
Contributor

回过头来看,这道题好像就是问题的这个意思,当时不理解。
[html] 第28天 说说你对标签的理解

xxf1996

xxf1996 commented on Jul 23, 2019

@xxf1996

<meta>用来描述网页的元信息;诸如字符编码,浏览器引擎编译,文档信息等等;

  • charset:声明当前文档的字符编码,用于浏览器解析文档;如:
<meta charset="UTF-8">
  • name:声明当前文档的元信息;常用的有viewportkeywordsdescription等;

    • viewport:文档视口设置,如初始视口大小(initial-scale),是否允许用户缩放(user-scalable)等;
    • keywords:网页的关键字,常用于搜索引擎对于该网页的搜索关键字;
    • description:网页的描述信息;
  • http-equiv:可以用来设定一些属性改变服务器或浏览器引擎对文档的编译行为;我只用过X-UA-Compatible这个属性,该属性只支持IE8+的浏览器,可以设定IE浏览器的渲染引擎;如:

告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面
<meta http-equiv="X-UA-Compatible" content="IE=edge">

http-equivname的属性,属性值通过<meta>标签的content属性来设置;

参考文档:

  1. <meta> - HTML(超文本标记语言) | MDN
  2. [FE] IE兼容性模式X-UA-Compatible - 简书
shuai4983958

shuai4983958 commented on Jul 23, 2019

@shuai4983958
1、 meta的作用 
     声明网页字符编码,描述网页元信息,浏览器引擎编译,文档信息
2、 meta的写法
   (1)声明网页字符编码
        <meta charset="UTF-8">
   (2)声明当前文档的元信息;常用的有viewport,keywords,description, http-equiv等;
      viewport:文档视口设置,如初始视口大小(initial-scale),是否允许用户缩放(user-scalable)等;
      <meta name="viewport" content="user-scalable=yes;width=device-width;initial-scale=1">
      keywords:网页的关键字,常用于搜索引擎对于该网页的搜索关键字;
      <meta name="keywords" content="爱学习,爱学习加盟,网页的关键字">
      description:网页的描述信息;
      <meta name="description" content="“办学大平台,教学好口碑”。网页的描述信息">
      http-equiv:可以用来设定一些属性改变服务器或浏览器引擎对文档的编译行为
      告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
nowherebutup

nowherebutup commented on Jul 23, 2019

@nowherebutup
  • 指定页面的兼容模式
<meta http-equiv="X-UA-Comptible"/>
  • 指定浏览器的渲染内核
<meta name="Render" content="webkit"/>
  • 指定当前页面的字符集
<meta charset="UTF-8">
Apple-yong

Apple-yong commented on Jul 30, 2019

@Apple-yong

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
让viewport的宽度等于物理设备上的真实分辨率,不允许用户缩放

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @haizhilin2013@Apple-yong@xxf1996@xiangshuo1992@shuai4983958

        Issue actions

          [html] 第98天 列举出你最常用的meta标签的写法和作用 · Issue #971 · haizlin/fe-interview