美文网首页
meta标签

meta标签

作者: 李永州的FE | 来源:发表于2017-05-19 17:49 被阅读0次

    一 HTML、XML、XHTML 有什么区别

    html:语法松散不严格,比如标签闭合要求不严格
    xml : 要求更严格(注意其与json的区别联系)
    xhtml: 是html--->xml转换的过渡

    二 怎样理解 HTML 语义化

    1 语义化实例:html5一堆新的语义标签:header,footer,nav,等等

    2 语义化好处:

    (1)可读性强,不使用样式也知道页面想要表达什么意思
    (2)利于seo,利于爬虫获取更多信息,网页排名更靠前
    (3)便与团队开发维护,和(1)照应

    3 如何进行语义化

    (1) 尽可能少的使用无语义的标签div和span
    (2) 不要使用纯样式标签,如:b、font、u等,改用css设置
    (3) 需要强调的文本,可以包含在strong或者em标签中(浏览器预设样式,能用CSS指定就不用他们),strong默认样式是加粗(不要用b),em是斜体(不用i)
    (4) 每个input标签对应的说明文本都需要使用label标签,并且通过为input设置id属性,在lable标签中设置for=someld来让说明文本和相对应的input关联起来

    4 具体应用(通过对比发现语义化的好处)

    传统标签

    <body>
    <div id="nav"></div>
    <div id="header"></div>
    <div id="footer"></div>
    </body>

    语义化标签

    <body>
    <nav>导航</nav>
    <header>头部</header>
    <footer>尾部</footer>
    </body>

    三 怎样理解内容与样式分离的原则

    1 好处

    (1). 好处是代码分工更加明确,高内聚低耦合
    (2). 便于开发维护,迅速定位bug
    (3). 提高搜索引擎抓取效率

    2具体表现.

    (1)标签内不准在写内联样式,一律用链接引过来外面的文件
    (2)尽量不用js直接操作样式

    四 有哪些常见的meta标签

    1.用于告诉浏览器该页面所用的编码是utf-8

    <meta charset='utf-8'>

    2 . name属性主要用于描述网页,比如说网页的关键字,内容等,便于搜索引擎抓取。

    <meta name='keywords' content='前端'>

    3 移动端适配最常见

    <meta name='viewport' content='width=device-width, initial-scale=1'>

    4 用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输

    <meta http-equiv='expires' content='Wed, 26 Feb 1997 08:21:57 GMT'>

    五 文档声明的作用?严格模式和混杂模式指什么?的作用?

    1
    (1) 文档声明指定了 HTML 文档遵循的文档类型定义(DTD), doctype声明指出阅读程序应该用什么规则集来解释文档中的标记,
    (2) 每个DTD都包括一系列标记、attributes和properties,它们用于标记Web文档的内容;此外还包括一些规则,它们规定了哪些标记能出现在其他哪些标记中

    2 <!DOCTYPE html>使用HTML5的方式,也就是标准模式来解析渲染网页

    3 标准模式与混杂模式

    若不添加文档声明,则处于混杂模式中,浏览器会以一种比较宽松的向后兼容的方式显示。慎用------
    在标准模式中,浏览器会按照W3C标准解析代码。

    六 浏览器乱码的原因是什么?如何解决

    通俗来说就是文档编码方式和浏览器解析用的编码方式不同
    <meta charset='XXX'>这个声明就很重要了

    七 常见的浏览器有哪些,什么内核

    IE浏览器——Trident内核
    chrome,safari——WebKit内核
    FireFox浏览器——Gecko内核
    Opera浏览器——Presto内核

    八 列出常见的标签,并简单介绍这些标签用在什么场景

    h1~h6,标题
    p,段落
    a,链接
    img,图片
    div,块状元素用来布局
    ul li ,无序列表
    ol li,有序列表
    table
    button,按钮
    span

    相关文章

      网友评论

          本文标题:meta标签

          本文链接:https://www.haomeiwen.com/subject/rfnyxxtx.html