初识HTML

作者: 知更鸟_b4d4 | 来源:发表于2017-07-31 10:13 被阅读0次

    好吧,百度上一堆解释我就不复制粘贴了,我现在就说说我的理解,欢迎指教。

    • HTML,XML,XHTML的区别
      其实这三者都是给程序看的文档,如果你做过Javaweb你肯定对此图不陌生。
    Paste_Image.png

    这个配置文件的作用是将你访问的路径对应成相应的class去处理。其实更确切的是依据这些文档的内容去完成相应的任务。而HTML和XHTML比较擅长做的事情仅仅是显示对应的“内容”而已,其他的标记语言比较擅长于让程序读懂内容。

    XML 被设计用来传输和存储数据,其焦点是数据的内容。
    HTML 被设计用来显示数据,其焦点是数据的外观。

    那么HTML和XHTML的区别仅仅是引文XHTML的语法更加严格而已。
    HTML语义化
    简单的来说有两点,其一是当用户使用关键词搜索时如何让你的网页更容易被百度(机器)搜到(然并卵,毕竟可以竞价排名啊),也就是说如何让机器知道该网页的内容。其二是如何让自己和别人更好的维护页面。

    1. HTML语义化三个阶段

    1、浏览器和W3C组织推出的如h1~h6、thead、ul、ol的HTML标签,用于在Web页面中组织对应的内容,如网页标题、表头、无序、有序列表,以达到更方便的协作及传播互联网内容。搜索引擎很好的利用了这些语义化标签抓取内容,又鉴于搜索引擎的巨大流量推荐,Web前端不得不考虑SEO,从而两者实现有益的循环,共同推进着语义化标签的使用。
    2、但Web的发展超乎想象,起初定义的HTML语义化标签,不足以实现对Web页面各个部分的功能或位置描述,所以Web前端人员利用HTML标签的id和class属性,进一步对HTML标签进行描述,如对页脚HTML标签添加如id="footer"或者class="footer"的属性(值),以“无声”的方式在不同的前端程序员或者前后端程序员间实现交流。
    3、W3C组织意识到了之前HTML版本的不足,推出的HTML5进一步推进了Web语义化发展,采用了诸如footer、section等语义化标签,弥补了采用id="footer"或者class="footer"形式的不足,以更好的推动Web的发展。

    1. 为什么要语义化
      其实语义化的目的就是让我们按照一定的规范组织页面,这样,你好,我好,它(机器)也好。

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

    在前端中,Html指的是结构;CSS指的是样式;JavaScript指的是行为。

    • 写 HTML 的时候先不管样式, 重点放在HTML的结构和语义化上,让 HTML 能体现页面结构或者内容。之后再去写样式。
    • HTML 内不允许出现属性样式,尽量不要出现行内样式。
    • 写 JS 的时候,尽量不要用 JS 去直接操作样式,而是通过给元素添加删除class来控制样式变化。

    有哪些常见的meta标签

    标签 含义
    <mata charset="utf-8"> 声明文档使用的字符编码
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/> 声明文档兼容模式,指示IE以目前可用的最高模式显示内容
    <meta name="keywords" content="your tags"> 定义针对搜索引擎的关键词
    <meta name="description" content="不超过850个字符"> 页面描述,告诉搜索引擎你的站点的主要内容
    <<meta name="author" content="你的姓名"> 定义网页作者
    <meta name="revised" content="David, 2008/8/8/" /> 定义页面的最新版本
    <meta http-equiv="refresh" content="5"/> 5秒刷新一次页面
    <meta http-equiv="expires" content="Mon,12 May 2001 00:20:00 GMT"> 用于设定网页的到期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式
    <meta http-equiv="pragma" content="no-cache"> 禁用缓存
    <meta http-equiv="set-cookie" content="Mon, 12 May 2001 00:20:00 GMT"> cookie设定,如果网页过期,存盘的cookie将被删除。需要注意的也必须使用GMT时间格式。
    <meta name="robots" content="index,follow" /> 搜索引擎索引方式

    文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?

    1、<!DOCTYPE>声明位于文档中的最前面,处于<html>标签之前,告诉浏览器的解析器,用什么文档类型来规范解析这个文档。
    2、严格模式的排版和js运作模式是以该浏览器支持的最高标准运行
    3、在混杂模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作
    DOCTYPE不存在 或格式不正确会导致文档以混杂模式呈现

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

    简单来说就是,HTML文档保存的编码方式和浏览器的解析方式不一样。
    解决方式,要不然用utf-8来保存文档,要不然通过mata charset声明你文档的编码方式。(其他方式,例如设置浏览器编码就别想了。遇到乱码时,你会这么做,用户可不会==||)

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

    浏览器 内核
    Internet Explorer IE内核
    Firefox Gecko
    Opear Presto
    Safari&Chromr Webkit
    国内大部分浏览器 IE内核

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

    标签 场景
    head标签 head标签是页面的“头部”, 一般来说,只有6个标签能放在<head>标签内:<title>、<meta>、<link>、<style>、<script>、<base>
    body标签 body标签是页面的“身体”
    h1~h6标签 设置不同的标题
    p标签 使用p标签来标记一段文字

    标签
    换行
    <div>标签 主要用来为HTML文档内大块的内容提供结构和背景
    <ul>标签 无序列表
    <ol>标签 有序列表
    <form>标签 设置一个表单
    <img>标签 设置一个图像

    相关文章

      网友评论

        本文标题:初识HTML

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