HTML是如此的简单，相信大部分学过HTML的人都是这样觉得的，不得不说HTML的确没什么难的，只要几小时甚至几十分钟就能掌握，所以这篇文章我会着重讲一点HTML的学前知识。
1.URL
url的中文翻译是统一资源定位器，通俗来讲，就是我们说的路径，路径又分为相对路径和绝对路径
相对路径
从文件当前所在位置出发查找目标位置
1、目标文件与当前文件在同一文件夹下，直接写文件名
src="1.jpg"
2、目标文件在子文件夹下，子文件夹名/文件名
src="images/1.jpg"
3、目标文件在当前文件的上一级目录，../文件名
src="../1.jpg"
4、目标文件在当前文件的上一级目录的子目录里 ../子目录名/文件名
src="../images/1.jpg"
当目标文件是当前站点下的文件时，可使用相对路径。
绝对路径
http://www.sohu.com/images/1.jpg
协议名 主机名 目录名 文件名
ftp://202.112.111.12/images/1.jpg
协议名 主机IP地址 目录名 文件名
从最根本的协议开始完整的表述路径
无论在哪个文件里都能找到目标路径
当目标文件是其他主机上的文件时，必须使用绝对路径。
常见的图片格式
GIF 最多只支持256色。支持动画
JPG 支持真彩色
PNG 支持透明和半透明，支持真彩色
HTML文件
HTML文件就是以.html、.htm、.xhtml等结尾的文件，用来编写HTML代码的
如何在HTML文件中编写代码和运行HTML文件
编写HTML代码没有那么多纷繁复杂的配置和安装软件，在windows系统中只需要用自带的文本编辑器即能完成HTML代码的编写，也不需要编译，可以直接在浏览器中运行
用文本编辑器打开HTML文件，右击 --> 打开方式 --> 选择记事本，即可在记事本开始编写HTML文件
编写完HTML代码并保存后在浏览器中运行，同样右击 --> 打开方式 --> 选择浏览器，即可在浏览器中查看到效果
附：当然，在实际工作中很少会直接使用系统自带的编辑器编写，初学者我推荐使用的编辑器可以是EditPlus，sublime text等编辑器
HTML的头部声明
头部声明我们也叫 声明，在 HTML 4.01 中, 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 是一套关于标记符的语法规则。它是XML1.0版规格得一部分,是html文件的验证机制,属于html文件组成的一部分。 DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML，所以不需要引用 DTD。
DTD：三种文档类型：S(Strict)、T(Transitional)、F(Frameset)。
Strict：如果您需要干净的标记，免于表现层的混乱，请使用此类型。请与层叠样式表(CSS)配合使用
Transitional：DTD 可包含 W3C 所期望移入样式表的呈现属性和元素。如果您的读者使用了不支持层叠样式表(CSS)的浏览器以至于您不得不使用 HTML 的呈现特性时使用
Frameset： DTD 应当被用于带有框架的文档。除 frameset 元素取代了 body 元素之外，Frameset DTD 等同于 Transitional DTD
html5作为现在的主流方向，他的头部声明简单明了
这就是HTML5的头部声明了
HTML的结构
在HTML的结构中除却头部声明，他由一个html标签包裹，里面分为头标签head和主体标签body
这是头部
这是主体
这些是每个HTML文件必须包含的元素
HTML标签的属性和属性值
HTML标签的属性是用来描述标签的一些特性的，前一篇文章我们介绍到，标签就像一个个盒子，那么这些盒子必定会有不同的作用和形态以及材料，比如装水的瓶，它可以是玻璃的材料，长圆柱形；装饼干的盒子，它可以是铁的，长四方体。HTML的标签也是如此，不过它是用属性来描述这些特性，用属性值表现这些特性，比如一个标签它有长高，那么就用width描述长，height描述高，接受属性值表现特性，也可以为其加入边框或者背景颜色，如下
这是文本标签
说明这个文本标签在页面中占有100px的长和100px的高
附：px是像素点单位，网页中常用的长度单位，除此之外还有cm，rem等
head标签
head标签里的内容不会直接显示在页面的内容之中的，他主要是用来包裹用于声明页面性质和引用外部资源标签的父标签
附：父标签与子标签
当标签里面包裹着标签，我们就叫被包裹的标签为子标签，外层包裹的叫父标签，如
// 父标签
这是head
head里常见的声明和外部资源引用标签
1.meta标签
meta标签的作用有：搜索引擎优化(SEO)，定义页面使用语言，自动刷新并指向新的页面，实现网页转换时的动态效果，控制页面缓冲，网页定级评价，控制网页显示的窗口等！meta可以接受各种属性值，以确定网页在浏览器中的一些性质，这里我只说一个必不可少的，就是编码的声明，这个是确定页面能否在浏览器中解析正确，如果设置了不正确的编码格式，页面将会乱码(关于编码，可以百度HTML的编码格式，了解更多)
这是主体
charset就是设置编码的格式的属性，UTF-8是通用的编码格式，中文编码格式为GBK
2.title标签
title标签是用来设置页面在浏览器标签栏中的标题的
这是标题这是主体
title
3.引用外部资源的标签
1.link标签
引用样式标签，这里我不会讲解样式标签的作用，这将会在css时着重讲解
2.script标签
引用脚本文件，这将会在JavaScript中着重讲解
主体body标签中的内容
body标签里的内容将是呈现在页面中用户看到的实际内容
图像img标签
必备属性：
src 定义图像的url
可选属性：
width 宽
height 高
alt 替代文字(多数情况下用title可替代alt，如果图片加载失败，显示在网页上的文字)
链接a标签
必备属性：
href 链接的目标路径
可选属性：
name 命名。命名后的a称之为锚点，可以作为链接目标
target 指定链接在什么样的窗口中打开
_self 默认。当前窗口
_blank 在新建的窗口中打开链接
(title、id、class)
锚点链接：这是一个特殊的链接方式，可跳到本页面中一个特定位置，这个指向是一个标签属性中的命名锚记或是id。
这是要跳转到地方
邮件链接：可以创建一个点击后发送邮件的链接
Table标签
table是 HTML里的布局工具，前期可用于简单布局
| 编号 | 姓名 |
| 1 | Tom |
| 1 | Lucy |
table
table的组成由外层的table和横行tr，纵行td组成，
table的属性 width、height、border、bordercolor、bgcolor
background、cellspacing、cellpadding、align
tr的属性 height align vlign
td的属性 width height align vlign colspan rowspan
table的可选标签：
caption 表格标题
thead 表格头部
这是表头
tbody 表格主体
这是表头
这是表的主体tfoot 表格尾部
这是表头
这是表的主体这是表尾文本标签
文本标签除了p标签外，还有span、i、b等标签
行内元素与块级元素
在这里，我将着重讲解一下行内元素与块级元素，这将有助于我们更好的理解HTML元素
什么是行内元素和块级元素？
行内元素，顾名思义，就是多个元素能排在一行，当大于一行的长度，才会挤向下一行，就像一个大盒子，里面可以放小盒子，这个小盒子就是行内元素
块级元素，自然就是那个大盒子，它是独占一行的元素，块级元素可以包裹行内元素，也可以包裹块级元素，但是行内元素不可以包裹块级元素
常见的块级元素：p、div、h1等
常见的行内元素：span、i、b等
一篇文章对于HTML标签的分享是有限的，更多的标签使用可以查看w3cSchool的html在线文档，在线文档地址
扫一扫
2602
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
