1、浏览器及内核

• web浏览器是用于读取HTML文件，并将其作为网页显示

• 浏览器最重要的部分或其核心是渲染引擎，我们一般称为内核；

• 内核的作用负责对网页语法的解释并渲染网页；

• 五大浏览器：chrome、safari、Firefox、Opera、IE

  1.chrome 谷歌浏览器

  生产商：Google

  内核：webkit、blink

  2.Firefox 火狐浏览器

  生产商：Mozilla

  内核：gecko

  3.Safari 苹果浏览器

  生产商：苹果公司

  内核：webkit

  4.opera 欧朋浏览器

  生产商：挪威欧普拉软件公司

  内核：presto blink

  5.IE 浏览器

  生产商：微软公司 Microsoft

  内核：trident

  其他浏览器：

  大部分国产的浏览器（qq浏览器，uc浏览器，猎豹浏览器，360浏览器）基本上是在IE浏览器的内核上进行的二次开发

  现在国内市场上有许多双内核的浏览器，使用的是trident,webkit内核

2、页面的三大组成部分

• 结构：给页面搭建基本的框架结构。 html ，类比于建房子的时候要搭的地基跟钢筋。

• 表现：页面的美化，装饰。 css 相当于给房子加背景和家具的排列布局。

• 行为：页面的轮播图，返回顶部... javascript 相当于房子加灯的开关。

  结构层html和表现层css，是 W3C 制定的规范，万维网联名。

行为层js，是 ECMA 制定的规范，欧洲计算机协会。

2、HTML介绍

1、什么是HTML

• HTML是 HyperText Mark-up Language 的首字母简写，意思是超文本标记语言。

  通过HTML标记（标签）对网页中的文本、图片、多媒体等内容进行描述。

  说明：

  • “超文本”：不仅能承载简单的文字、还能包含超链接、图片、音频、视频等。

  • “标记语言”：标记语言是由一套标记标签组成的。

2、HTML文档——网页

HTML文档也被称为网页

• 后缀名.html

• 文件名格式： 主文件名.后缀名

创建HTML文档

• 1）新建一个后缀名为.html的文件

• 2）添加基本结构：英文状态下!回车

• 1. 输入HTML：5

3、标记（标签）

构成网页的基本单位

• 标签：由尖括号括起来的关键词

  • 单标签：<标签名 >或 <标签名 />

  • 双标签：<开始标签名>[内容]

• 元素：标签及内容的整体

• 属性

<标签名 属性名1="属性值1"  属性名2="属性值2">

<后面的第一个单词叫做标签的名字，标签名空格之后的叫做标签的属性。

• 属性由属性名和属性值组成，属性名和属性值用等号连接

• 属性值用引号引起来。 多个属性之间用空格隔开。

4、HTML注释

• 注释即对代码的解释和说明，不会被浏览器解析执行

• 注释内容不会出现在网页中，只是对代码的一个说明

• 语法

HTML中的注释以``结束，开始和结束中间为注释内容。

• ctrl + /

• alt + shift + a: 可以在一行代码的后面进行注释

5、HTML文档的基本结构

​


​
父子关系——嵌套关系兄弟关系——并列关系

​

6、常用HTML标签

1）块级标记

• div标签 搭建网页结构的基本标签——盒子；无语义标签

[内容]
 文字内容

- 特性- 宽度默认撑满整个父元素- 高度默认由内容撑开- 独立成行——垂直布局
​作用：可以用来划分页面的区块，里面嵌套任何的标签

• h系列标签：标题标签 标题标签中文字大小依次减小，重要程度依次减弱。 注意事项：h1标题一个页面中只有一个，h2~h6是可以有多个的。

    
title1
title2
title3
title4
title5
title6

- 特性- 宽度默认撑满整个父元素- 高度默认由内容撑开- 独立成行——垂直布局- 自带外间距- 自带加粗效果应用场景：- logo- 文章页标题、内容章节标题- 产品标题- 模块标题等

• p标签：段落标记

[文字]

- 特性- 宽度默认撑满整个父元素- 高度默认由内容撑开- 独立成行——垂直布局- 自带外间距应用场景：文章中的段落、页面中的文字块注意：p标签不能嵌套块级标签，例如：div，p,h1~h6

• hr标签：水平分割线 块级标记

  - 特性- 默认自带间距、自带边框 作用：在页面中显示一条水平线

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！