HTML第一天

HTML基础

1.什么是浏览器？

帮助用户浏览网页的软件

2.五大浏览器及其内核

Ie-trident safari-webkit ff-gecko chrome,opera-blink

3.服务器端

经过互联网，接受用户的请求，然后跳转到互联网相应的界面。

常用服务器端软件有IIS,Tomcat。

4.HTML发展历程

HTML1.0---HTML2.0---HTML3.2---HTML4.0---HTML4.01---XHTML1.0---XHTML1.1---HTML5.0

5.常用名词

Internet（因特网）：实现全球信息互联的网络；

WWW（万维网）：提供网站相关服务；

W3C（制定万维网的组织）；

HTTP（超文本传输协议）：表现为三种形式，即超文本（hypertext）、超媒体（hypermedia）、超文本传输协议（HTTP）等。；

Web（互联网的总称）：即网页；

DNS（域名解析系统）：因特网上作为域名和IP地址相互映射的一个分布式数据库。

6.网页的组成

HTML：页面结构

CSS：页面样式表现

JavaScript：交互行为

7.HTML页面结构和语法

HTML：指的是超文本标记语言 (Hyper Text Markup Language)，是一种标记语言 (markup language)，是用来描述页面的结构和组织页面内容的.

HTML的结构

<html> html文档

<head></head> html头部

<body> html身体

<h1>My First Heading</h1> 内容

<p>My first paragraph.</p>

</body>

</html>

特点：成对出现，有开有闭合，尖括号括住了标签名。结束标签内增加了斜线。

语法：<标签名> 标签内容</标签名>

第一：标签成对出现。第二：结束标签内部用/开头。

第三：标签可以嵌套。

HTML语法

HTML标签以 ”<“开头。

紧接着就是标签名（中间没空格）。

标签名之后如果有属性的话，加空格然后是属性名=""

如果有多个属性，属性间用空格隔开，空格可以有多个。

属性结束后可以加一个或多个空格。

然后是结束标签">",如果是闭合标签需要在标签名前加”/"，例如：</html>

单标签，斜线没有任何意义，可有可无。

标签中间可嵌套内容。

8.HTML标签

文档后缀：.htm=.html

快速生成HTML页面结构

Html:5+tab键生成html5的文档结构

（1）Doctype标签：文档协议声明标签（必须要有）

文档协议声明标签，非常重要

协议不同影响整个页面显示的效果

目前主流用HTML5的协议文档

Html5文档声明：<!DOCTYPE html>

（2）html标签：文档标签

<html>标记位于<!DOCTYPE> 标记之后，也称为根标记，用于告知浏览器其自身是一个 HTML 文档， <html>标记标志着HTML文档的开始，</html>标记标志着HTML文档的结束，在他们之间的是文档的头部和主体内容。

<html>

所有的标签必须写在两个闭合标签之间。

</html>

可以通过lang属性设置当前文档的主要语言是什么，帮助搜索引擎解析文档

（3）Head标签：文档头部标签

<head>标记用于定义HTML文档的头部信息，也称为头部标记，紧跟在<html>标记之后。

head标签定义的内容只是提供给浏览器使用，不用于用户的呈现。

主要用来封装其他位于文档头部的标记，例如<title>、<meta>、<link>及<style>等，用来描述文档的标题、作者以及和其他文档的关系等。

一个HTML文档只能含有一对<head>标记，绝大多数文档头部包含的数据都不会真正作为内容显示在页面中。

------- <meta charset="UTF-8">

utf-8是目前最常用的字符集编码方式，常用的字符集编码方式还有gbk和gb2312。

gb2312 简单中文

GBK包含全部中文字符繁体

BIG5 繁体中文

UTF-8则包含全世界所有国家需要用到的字符

-------<title>标记用于定义HTML页面的标题，即给网页取一个名字，必须位于<head>标记之内。一个HTML文档只能含有一对<title></title>标记，<title></title>之间的内容将显示在浏览器窗口的标题栏中。其基本语法格式如下：

<title>网页标题名称</title>

title标签对于网站SEO至关重要，标题的好坏直接影响网站的SEO

SEO（Search Engine Optimization）：网站搜索引擎优化

-------Link标签（先了解）

引入DNS预先解析

dns预解析(了解)

引入网站icon图标：

引入css样式，【后面讲】

HTML第一天

HTML基础

推荐阅读更多精彩内容