HTML学习笔记(一)HTML基础知识

一、服务器和浏览器

1、浏览器:安装在电脑的一个软件,能让网页内容呈现给用户查看,并让用户与网页交互的软件。
浏览器内核:浏览器所采用的渲染引擎,渲染引擎决定了浏览器如何显示网页内容,以及页面格式信息。

3、服务器:服务器是超级计算机,是电脑,但它比普通电脑配置要高,且24小时不停电,不关机。服务器专门用于存储数据,访问者可以访问浏览器获得服务器上存储的资源。若服务器关机,访问者就无法访问。

二、 浏览器访问网页原理及其请求数据的过程

1、当我们利用浏览器访问网页时,其实是有真实的物理文件传输,浏览器会先将网页上的内容缓存到本地文件中,然后再渲染出来给用户查看。

2、平时上网时会感到第二次访问网页比第一次访问网页要快,就是因为第一次访问时已经将这个网页上的信息缓存到了本地。

3、通过观察,发现缓存文件夹中除了缓存图片还缓存了一些js、css、html等文件,即网页是一堆文件。网页越复杂,那么组成这个网页的文件就越多。

4、浏览器请求数据的过程
在这里插入图片描述

三、URL及其他知识补充

1、URL:在浏览器地址栏输入的地址。

2、URL格式:
在这里插入图片描述
服务器ip地址和端口号的作用:告诉浏览器我们需要访问的服务器的详细地址。

3、HTTP协议:用来规范浏览器和服务器的沟通。

4、纯文本文件:能被记事本打开并能正常显示的文件(如.html文件)。

5、W3C:负责web方面标准的制定。

6、HTML和XHTML区别:
(1)html5兼容xhtml、html。
(2)HTML语法松散,容错性高;XHTML更为严格。

四、HTML作用及基本结构

1、HTML作用:描述文本的语义。用来描述其他文本语义的文本,我们称之为标签,因为这些标签在浏览器中不会被显示出来,所以我们称之为“超文本”,因此HTML被称为“超文本标记语言”。

2、注:HTML是用来给文本添加语义的,而不是用来修改文本样式的

3、基本结构

<!DOCTYPE html>
<html>
	<head>
    	<title></title>
	</head>
	<body>
	</body>
</html>

4、结构详解
(1)<HTML>:用于告诉浏览器这是一个网页,即告诉浏览器我是一个HTML文档。
注:其他所有标签都必须写在html的开始和结束标签里面。
(2)<head>:用于给网站添加一些配置信息,如:指定网站的标题。一般情况下,写在head标签内部的内容都不会显示给用户查看。
(3)<title>:专用于指定网站的标题,并且这个指定的标题将来还会作为用户保存网站的默认标题。
注:title标签必须写在head标签里面。
(4)<body>:用于定义HTML文档中需要显示给用户查看的内容。
注:一对html标签中只能有一对body标签。

五、字符集问题

1、meta标签:指定当前网页的字符集。

2、为什么会乱码:编写网页时没有指定字符集。

3、如何解决乱码问题:在head标签中添加<meta charset="GBK"/>,指定字符集。

4、GBK(GB2312)里面存储的字符比较少,仅存储了汉字和一些常用的外文。其体积小,访问较快。

5、UTF-8里面存储世界上所有的文字,体积比较大。
注:在HTML文件中指定的字符集必须和保存这个文件的字符集一致,否则还是会出现乱码

六、标签分类

1、单标签:只有开始标签,没有结束标签。

2、双标签:既有开始标签,也有结束标签。

3、标签关系
(1)并列关系:兄弟/平级
(2)嵌套关系:父子/上下级关系

七、DTD文档声明

1、DTD文档声明:每个不同HTML版本的规范都有不同的DTD文档声明;作用:编译/解析/渲染网页。
注:这里将的主要是HTML5的文档声明,因为HTML5的文档声明是向下兼容的。

2、DTD文档声明:<!DOCTYPE html>
(1)任何一个标准的html网页,第一行必须是DTD文档声明。
(2)DTD文档声明不区分大小写。
(3)DTD文档声明不是一个标签。
(4)虽然DTD文档声明的作用是告诉浏览器我们的网页是用哪个版本的标准编写的,以便于浏览器解析和渲染,但浏览器并不完全依赖DTD文档声明,浏览器有一套属于自己的机制。
(5)不写也能正常运行,但W3C规定第一行必须写上DTD文档声明。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值