码迷,mamicode.com
首页 > Web开发 > 详细

总结之HTML基础一

时间:2016-07-17 23:25:10      阅读:405      评论:0      收藏:0      [点我收藏+]

标签:

正所谓温故而知新,

近期有了总结知识点的想法,

想把之前学习的知识作一个分阶段性的总结,

就从html开始吧!!!

一、浏览器与服务器

1. 浏览器

1.1 浏览器是什么

1.浏览器是一种交互软件(与服务器进行收发包,与用户进行交互)

1.2 浏览器作用

1.解析渲染页面内容(html&cs&js)

2.让html文件和用户进行交互

1.3 浏览器分类(按内核)

1. Webkit  -webkit-: chrome safari

2. Gecko   -moz-: firefox

3. Blink    -0-: opera

4. Trident  -ms-: IE,猎豹安全浏览器,360极速浏览器,百度浏览器(国产浏览器)...

2. 服务器

2.1 服务器是什么

1. 服务器也叫伺服器,提供计算机服务的设备

2.2 服务器作用

1. 响应服务请求,处理请求

2. 承担服务,保障服务

2.3 服务器特点

1. 处理请求

2. 24小时开机

 

3. 使用开发人员工具来查看请求和响应

3.1 右键浏览器页面,点击审查元素

 技术分享

 

 

3.2 打开开发人员工具

 技术分享

 

 

3.3 打开network

 技术分享

 

 

3.4浏览器向服务器发送请求

 技术分享

 

 

3.5浏览器请求的详细信息

 技术分享

技术分享

 

 

3.6 浏览器请求数据的原理

浏览器请求的页面直接去服务器上找(请求报文),找到了以后将这个文件中的内容通过repsonse响应回浏览器(响应报文)。

 技术分享

 

4. 浏览器请求协议: HTTP

4.1 请求报文(request)

浏览器向服务器发送请求数据

4.2 响应报文(response)

服务器得到浏览器的请求,并响应返回数据

4.3 URL:(地址)

url的组成: 协议://服务器的ip地址:端口号/请求的页面

 

5.页面的本质

5.1查看页面源代码

 技术分享

技术分享

 

5.2 浏览器的本质作用

浏览器将服务器响应回来的response进行从上到下的解析(渲染),将最后的页面效果显示出来。

5.3 世界上第一个html页面

http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html

 

 技术分享

 

 

6.浏览器内核

6.1 内核的本质

内核(Rendering Engine):可大概译为“渲染引擎”,不过我们一般习惯将之称为“浏览器内核”。负责对网页语法的解释(如标准通用标记语言下的一个应用HTMLJavaScript)并渲染(显示)网页。

 

6.2 内核的分类

Trident[?tra?dn:t]:ie , 猎豹安全浏览器,360极速浏览器,百度浏览器...

Gecko[?geko?]:Firefox

Webkit[webkit]:Safari ,Chrome,Opera(2013年使用webkit内核)

Blink(基于webkit内核)

 

6.3 不同内核的区别

不同的内核在渲染同一内容的时候会有差别(兼容性问题)

浏览器内核渲染页面是从上到下依次渲染

 

二、浏览器能够识别的语言

2.1 W3C三层分离原则

HTML: 从语义角度描述页面结构

 

CSS: 从审美角度美化页面

 

JavaScript: 从交互角度提升用户体验

 

三、HTML

3.1本质

超文本标记语言(HyperText Markup Language)

在浏览器上运行的标记语言,用标签对内容进行标记

每一个标签都有自己的语义

3.2 标签与标签之间的关系

3.2.1 嵌套关系

<a href=”#”><img src=”#”/></a>

3.2.2 并列关系

<p></p>

<div></div>

 

3.3 HTML固定结构

<html>这是猪

<head>这是猪头

<title></title>这是猪眼睛

</head>

<body></body>这是猪肉

</html>

结构记忆法:二师兄

 技术分享

 

3.4 编写一个HTML文件

3.4.1 传建一个记事本文件,后缀名为.html

 技术分享

 

3.4.2 以记事本打开: (编写HTML代码)

 技术分享

 

3.4.3 输入HTML的结构与内容

<html>

<head>

<title></title>

</head>

<body>

今天天气不错啊!

</body>

</html>

 

3.4.4 保存找到原始文件,打开方式---浏览器(查看页面效果)

 技术分享

 

 

3.5 文件的后缀名和打开方式

3.5.1 文件的后缀名

1. 修改文件的后缀名是不会改变内容的。
2. 后缀名是用来决定这个文件的默认打开方式。

3.(针对我们编写的html页面)如果我们要查看这个文件的内容,直接以浏览器方式打开。但是如果我们要修改这个文件中的内容,应该以记事本的方式打开。

3.5.2 文件的打开方式

电脑中安装了很多的应用程序,可以为某一些的文件选择一种默认的打开方式,如果要修改,可以选中其中一个文件,右键,打开方式(所有的该类程序都以这种方式打开。)

 

总结之HTML基础一

标签:

原文地址:http://www.cnblogs.com/liu666/p/5679610.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!