HTML5 (一) 基本概念

结合李南江教授网课内容 :

什么是浏览器

  1. 将网页渲染出来,让用户查看
  2. 让网页可以和用户交互

五款浏览器

  • IE  Google  火狐  safari  opera
  • 这五款浏览器的内核不同,会引起兼容问题,其他浏览器都是用他们的内核,只要能处理这五款浏览器,其他浏览器就能处理,所以开发时主要测试这五款浏览器。

什么是服务器

  • 服务器也是一台电脑,只不过配置比我们高,不能关机,实时满足客户端的需求,用来存储数据。

老师实验得出的结论 :

  • 当我们浏览器浏览网页时,会下载真实的文件
  • 上网的本质就是下载文件
  • 网页越复杂下载到本地的文件越多

浏览器搜索网页的本质

  1. 输入地址,发送请求情报
  2. 浏览器处理请求
  3. 将结果返回给浏览器
  4. 发送“响应报文”
  5. 解析浏览器返回的内容呈现给用户

什么是URL

  • 首先明确在浏览器的地址栏中输入的就是一个URL,也就是平常所说的网址。
  • URL格式 :http://127.0.0.1(:80)/index.html(会自动添加:80)

URL拆分

http://URL协议类型
127.0.0.1服务器IP协议
:80服务器的端口号
index.html需要访问的资源的名称
  • IP地址 :相当于大范围地址
  • 端口号 : 相当于准确的门牌号
  • index.html 的作用 :当通过IP地址和端口号找到对应的服务器之后,需要通过资源名称告诉服务器,我们需要获取服务器上的哪个资源。

什么是http协议

  • 在现实生活中有很多协议,例如房租协议,买卖协议,离婚协议,无论是什么协议他们都有一个共同点,就是用来规范、约束某一类事物。http协议也是如此。
  • 沟通最常见的就是语言问题,http协议相当于让沟通双方的语言统一,约束浏览器和服务器之间的沟通。
  • 同一个文件是可以被同时被多个软件打开的,且不同软件显示的效果是不相同的。

什么是纯文本

  • 我们Windows电脑上有一款默认安装好的软件记事本,这款软件是专门打开纯文本文件,只要能被记事本打开,就都是纯文本文件。
  • .html可以用记事本正常打开,因此它是一种纯文本文件。
  • 浏览器的本质是通过特殊的方式,特殊的格式来读取文件。
  • 超文本 : 这些文本是用来描述其他文本的,并且标记信息不会在浏览器中显示,所以称之为超文本标记语言。
  • html是专门用来描述文本语义的,也就是我们可以用html来告诉浏览器哪些是标题,哪些是段落。
  • 注意事项 :html的作用仅仅是给文本添加语义的,而不是来修改w文本的样式(文本字体大小等),只是来告诉浏览器,哪些文字是标题,哪些是内容等等。

HTML5历史问题 (以及和XHTML的关系):

  • HTML是93年发布的,发布的时候没有标准
  • 95年的HTML2是有标准的
  • 99年html的不再更新转而开始制作xhtml
  • XHTML是html是更加严谨的标准。
  • XHTML2.0推出来后遭到五大浏览器厂商的联合抗议。
  • W3C为了继续发展妥协将html5草案和xtml2做了结合形成现在的HTML5
  • HTML5是HTML5草案和XTML2合并的结果

编写网页的步骤 :

  1. 新建一个文本文档
  2. 利用记事本打开
  3. b编写html代码
  4. 将文件名改为.html
  5.  利用浏览器打开编写好的文件
  6.  命名用英文或者拼音
<html>
	  <head>
		<title></title>
	  </head>
	  <body>
	  </body>
</html>

特别注意点 : html的基本结构中所有的标签都是成对出现。

基本结构中标签的使用 :

<h3 id="title8">html标签</h3>
1.用来告诉浏览器这是一个网页,也就是告诉浏览器我是一个html的一个文件
注意点 : 其他所有标签都必须写在html标签里面,也就是写在html开始标签和结束标签中
<h3 id="title9">head标签</h3>
作用:
用于给网络添加一些配置信息
例如 :
1. 指定网站的标题/指定网站的小图片
2. 指定网站的SEO信息(指定网站的关键字/指定网站的信息)
3. 外挂一些外部的CSS/JS文件
4. 添加一些浏览器适配的相关内容
注意点 :
一般情况下,卸载head标签下的内用户是看不到的,这些内容是写给浏览器进行解析的
<h3 id="title12">title标签</h3>
作用:
专门用于指定网站的标题,并且这个指定的标题将来还会作为用户保存网站的默认标题。
注意 : title标签必须卸载head标签里面
<body></body>
作用 : 专门用于写用户需要查看的内容(文字/图片/音频/视频)
注意 : 可能在其他地方写用户也可以看到,但千万不要这么做,必须写在body中。

字符集 :

  • 网页中没有指定字符集。
  • meata标签 :就是指定当前的网页的字符集。
  • 网页中可以选择字符集,其实就是解码方式 ,解码有很多种,必须能够正确解析文本文件才能显示正确。

对比UTF-8和GBK :

  • GBK(GB2312)里面存储的字符比较少,仅仅可以解码汉字和一些常见外文
  • utf-8里面存储的世界上所有的文字。
  • 如果网站仅仅包含中文,推荐使用GB2312,因为它的体积小,访问速度快
  • 如果网站除了中文网站以外,还包含一些其它国家的语言,那么推荐使用utf-8.
  • 注意点 :
  1. 在HTML文件中指定的字符集必须和保存字符集一致,否则还是会出现乱码。
  2. 所以仅仅指定字符集不一定能解决乱码问题,还需要保存文件的时候,文件的保存方式必须和指定的字符集(解码方式)一样才能保证没有问题。
  3. meata的格式必须和保存的方式一致。

单标签和双标签 :

  • 单标签 :只有开始标签
  • 双标签 : 既有开始标签也有结束标签

标签关系

  • 并列关系(兄弟关系)
  • 嵌套关系(父子关系)

DTD文档声明 :

  • 什么是DTD文档声明 :由于html由很多个版本,为了让浏览器更好的编译、运行和渲染我们的网页,我们必须在html文件的第一行声明当前网页是用哪一种html的标准来写的,这就是dtd文档声明
  • DTD文档声明格式 :每一个版本的html都有自己的声明格式,而html5采用的是能向下兼容的<!DOCTYPE html>
  • DTD文档声明并不是一个标签,只是告诉浏览器html的正确使用版本。
  • 注意点
  1. 虽然DTD的声明是来告诉浏览器使用哪一种html的标准,以便于浏览器可以更好的编译解析渲染,但是浏览器并不是完全依赖的使用这个DTD文档声明,浏览器自己有一套机制,
  2. 简单的说即使不加这个DTD文档说明,浏览器还是能够正确的进行解析,但为了遵守W3c的格式,我们还是默认在html文件的第一行加入这个声明
  3. 对大小写不敏感

html html5 和 xhtml的区别 :

  • HTML语法非常宽松,容错性强。
  • XHTML 语法非常严格,要求比较苛刻

.htm和.html的区别 :

  • 因为老系统的后缀只允许三位字母,所以为了适应老的系统只保留后面三位,就有了htm。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值