html语言

一、web标准  

<!--
W3C: 万维网联盟组织,用来指定web标准的组织
web标准:制作网页遵循的规范
web标准的分类: 结构标准  表现标准  行为标准  
对应:结构html 表现css   行为JavaScript

html: 制作网页的
css:  对网页进行美化
JavaScript: 让网页动起来 
-->

二、浏览器扫盲

<!--
常用浏览器内核
    IE : trident
    chrome : blink
    Firefox : gecko
    safari : webkit
    
浏览器内核也及时浏览器所采用的的渲染引擎,渲染引擎决定了浏览器如何显示网页的内容及页面的格式信息,渲染引擎是兼容性问题出现的根本原因
-->

三、html介绍

<!--
概述:
    html全称Hyper Text Mark-up Language 超文本标记语言 它不是一种编程语言,是一种描述性的标记语言,用于描述超文本内容的显示方式,比如字体、颜色、大小等
    超文本: 音频 视频  图片称为超文本
    标记: <英文单词或字母>称为标记  一个html页面由各种标记组成  

作用: html是负责描述文档语义的语言
PS: html语言不是一个编程语言(有编译过程),而是一个标记语言(没有编译过程),直接由浏览器解析执行
    
html语义:
    html是一个纯文本的文件,用一些标签描述文字的语义,这些标签在浏览器里面是看不到的,所以称为超文本标记语言

html网络术语:
    网页: 由各种标记组成的一个页面就是网页
    主页: 一个网站的起始页或者导航页面
    标记: <p>为起始标记  </p>为结束标记  也叫标签,每个标签对都规定好了特殊含义
    元素: <p> 内容 </p> 称为元素   
-->

四、html规范

<!--
html是一个弱势语言
html不区分大小写
html页面的后缀名是以html或者htm(有些系统不支持后缀名长度超过3个字符,比如dos)
html的结构:
    声明部分:用来告诉浏览器这个页面使用的哪个标准
    head部分:将页面的一些额外信息告诉服务器,不会显示在页面上
    body部分:我们所写的代码必须放在此标签内
    
书写html规范:
    1、所有标记元素都要正确的嵌套,不能交叉嵌套  正确写法举例:<h1><font></font></h1>
    2、所有标记都必须小写
    3、所有标记都必须关闭
        双边标记:<span></span>
        单边标记:<br> 转成 <br /> <hr> 转成 <hr />,还有<img src=“URL” />
    4、所有的属性值必须加引号   <h1 id="head"></h1> 
    5、所有的属性必须有值   <input type="radio" checked="checked" />
html对换行不敏感,对tab不敏感
    html值在乎标签的嵌套结构,嵌套的关系,谁嵌套了谁,谁被谁嵌套,和换行,和tab无关,换不换行,tab不tab都不影响页面结构
    也就是说,html不是依靠缩进来表示嵌套的,就是看标签的包裹关系。但是,良好的缩进,可以使代码更易读 

HTML中所有的文字之间,如果有空格、换行、tab都将被折叠为一个空格显示。
-->

五、html结构介绍

<!--  <!DOCTYPE html>  主要作用:用来告诉浏览器这个页面使用那个标准    -->
<!DOCTYPE html>
<html lang="en">

<!--  <head>  </head> 主要作用:html页面头部信息设置,不会显示在网页上-->
<head>
    <!-- <meta charset="UTF-8">  设置 -->
    <meta charset="UTF-8">      
    <title>我的第一个html页面</title>
</head>

<!-- <body>  </body>  主要作用:页面显示部分,即数据部分,显示到网页上的-->
<body>
<h1>
    html:超文本标记语言
</h1>
</body>
</html>
<!--
1、文档声明头
    <!DOCTYPE html>   开头这一行,就是文档声明头,DocType Declaration 简称DTD。此标签可以告知浏览器文档使用哪种html或xhtml规范

    XHTML:Extensible Hypertext Markup Language,可扩展超文本标注语言。

    XHTML的主要目的是为了取代HTML,也可以理解为HTML的升级版。

    HTML的标记书写很不规范,会造成其它的设备(ipad、手机、电视等)无法正常显示。

    XHTML与HTML4.0的标记基本上一样。

    XHTML是严格的、纯净的HTML
2、head标签,包含<title> <meta> <link> <style>
    <title>  指定整个网页的标题,在浏览器最上方显示
    <meta>   提供有关页面的基本信息
    <link>   定义文档与外部资源的关系
    <style>  定义内部样式与网页的关系

2.1 meta标签
    元素可提供有关页面的原信息(meta-information),针对搜索引擎和更新频度的描述和关键词。
    标签位于文档的头部,不包含任何内容。
    提供的信息是用户不可见的
    两个属性:http-equiv   name  不同的属性有不同的参数值,这些不同的参数值就实现了不同的网页功能
2.1.1 http-equiv属性
    它用来向浏览器传达一些有用的信息,帮助浏览器正确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。
    <!--重定向 2秒后跳转到对应的网址,注意分号-->
    <meta http-equiv="refresh" content="2;URL=http://www.luffycity.com">
    <!--指定文档的内容类型和编码类型 -->
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <!--告诉IE浏览器以最高级模式渲染当前网页-->
    <meta http-equiv="x-ua-compatible" content="IE=edge">

2.1.2 name属性
    主要用于页面的关键字和描述,是写给搜索引擎看的,关键字可以有多个用 ‘,’号隔开,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
    <meta name="Keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信" />
    只要设置Description页面描述,那么百度搜索结果,就能够显示这些语句,这个技术叫做SEO(search engine optimization,搜索引擎优化)。
-->
原文地址:https://www.cnblogs.com/lichunke/p/9915094.html