HTML 简介

个人编写HTML使用的软件是dreamweaver，这个软件的话，正版是要购买的，一开始学习HTML就是用的这个软件了，挺好用的，而且代码提示特别方便，不用担心太多的标签和属性记劳~

1.什么是HTML？

HTML 是用来描述网页的一种语言，指的是超文本标记语言: HyperText Markup Language；
HTML 不是一种编程语言，而是一种标记语言；
HTML文档也叫做 web 页面；

2.HTML基本结构

<!DOCTYPE html>：文档声明；
<html>：HTML 页面的根元素；
<head>：用于定义文档的头部，是所有头部元素的容器；
<meta>：提供有关页面的元信息，位于文档的头部，不包含任何内容；
<title>：文档的标题；
<body>：定义文档的主体，包含文档的所有内容；

3.HTML标签使用？

HTML 标签是由尖括号包围的关键词，且通常是成对出现的如<a></a>，当然也有单个的，只不过比较少如<hr>；
标签对中的第一个标签表示开始标签，第二个标签表示结束标签；

4.HTML常用标签介绍

除了HTML基本结构的几个标签以外，HTML还有一些比较常用的基本标签；

（1）文本标签：

h1-h6：用于定义标题，h1为最大标题，h6为最小标题；
p：定义段落；
span：组合文档中的行内元素；
br：换行；
hr：水平线；
strong/b：加粗文字；
em/i：斜体；
u：下划线；
s：删除线；
pre：定义预格式化的文本，保持原有格式；
sub：下标；
sup：上标；
blockquote：块引用；

（2）布局标签：

div：定义文档中的分区或节，把文档分割为独立的、不同的部分；
header：定义页面的头部；
aside：用作文章的侧栏；
section：定义文档中的节；
footer：定义文档或节的页脚，通常包含文档的作者、版权信息、使用条款链接、联系信息等；
article：规定文章独立的其他内容，如标题、内容、评论；

（3）多媒体标签：

img：用于在网页中插入图像；
audio：定义声音，比如音乐或其他音频流；
video：定义视频，比如电影片段或其他视频流；

（4）超链接标签：

a：定义超链接，指定页面间的跳转；

（5）序列化标签：

ul：定义无序列表；
ol：定义有序列表；
li：定义列表项目，可用在无序列表ul和有序列表ol中；
dl：定义了定义列表；
dt：定义了定义列表中的项目（即术语部分）；
dd：在定义列表中定义条目的定义部分；

（6）表格标签：

table：定义 HTML 表格；
tr：定义表格的行；
td：定义表格的单元；
th：定义表头；
caption：定义表格标题；
col：为表格中一个或多个列定义属性值；
colgroup：用于对表格中的列进行组合，以便对其进行格式化；
thead：定义表格的表头；
tbody：表格主体，也就是正文部分；
tfoot：定义表格的页脚（脚注或表注）；

（7）表单标签：

form：用于为用户输入创建 HTML 表单；
input：用于搜集用户信息；
button：定义一个按钮；
select：创建单选或多选菜单；
option：定义下拉列表中的一个选项；
textarea：定义多行的文本输入控件；
label：为 input 元素定义标注（标记）；
fieldset：用于将表单内的相关元素分组；
legend：为 fieldset 元素定义标题；

5.HTML注意事项

HTML文件当以后缀名为 .html 或 .htm 来命名；
HTML标签和属性是不区分大小写的，建议HTML标签和属性都小写，属性值必须用双引号包围；
HTML标签都是以开始标签起始，以结束标签终止；
HTML标签之间尽量缩进与换行，每行代码不要过长，方便阅读和维护；
HTML标签使用必须符合标签嵌套规则，如禁止a标签嵌套a标签，p标签嵌套div标签等；
建议不使用HTML已经废弃的或者不赞成使用的标签，少使用table布局、iframe框架嵌套以及flash播放器；

序列定义：

文字前面的符号或者序列

特点：

块元素，独立成行，行间距，行缩进

类别：

包括两种，一种是有序的叫ol，一种是无序的ul

两者共同点：

这两个都同样嵌套li。

无序标签属性：

type disc 实心圆（默认属性） circle空心圆 square实心四方

有序标签属性：

type =1 a A i I

start="n"从第n个数开始计数

嵌套关系，UL可以嵌套UL，原则是继续缩进

tm是超文本标记语言简称，英文全名是“Hyper Text Markup Language”,是构成网站网页文档主要语言，它是一种标记语言而不是编程语言，是由一套标记标签来描述网页内容，这些内容主要由浏览器解释(展示给网站访客)，同一个html文件如果不加处理对于不同的浏览器显示不同的效果导致出现浏览器兼容问题，处理浏览器兼容问题其实就是要处理同一html文件在不同浏览器显示不同效果的问题。

html从1993年诞生25年以来从当初1.0发展现在5.0(html5)，而html5经过近几年的发展现在已经十分火热了，现在网页布局方法基本上都是“div+css”，传统的table布局现在用的已经很少只有一些特殊功能页面才会用到table布局比如说调查问卷。下面就为大家介绍“学好html语言需要掌握什么?前端工程师需要明白什么?”

打好基础

1、打好基础

这里说的基础主要是指熟练使用DIV+ CSS的基础内容，熟悉使用常用的标签div、p、span、ul、li等，熟练掌握css常用设置效果比如说图文混排、图文环绕、背景设置、段落文字等，有兴趣可以研究css高级使用方法(滤镜、特殊定位等)，只有熟练掌握好了这些内容对于以后做工作才能得心应手。

持续学习

2、持续学习(向大牛学习)。

基础内容一般7到10天就可以掌握，一百个个人写同一个页面有一百种不同的方法，有的人可以用最少的代码写出很复杂的效果而且兼容问题很少，这就要求我们自己要不断去琢磨方法和学习提高自己能力，最简单的办法学习大牛们的代码是怎么写的，最简单你可以拿四大门户页面代码好好研究研究，如果能静下心来去研究相信你会收获不少。

沟通

3、与同事(特别是后端)沟通。

web开发想要达到最终的结果，前端和后端必须需要相互沟通，打个比方前端页面是货架，而后端就是放在货架上的商品，和同事沟通不仅仅可以使工作减少不必要的麻烦(特别是返工)也可以让在沟通中学习更多的东西，所以多跟同事沟通对我们绝对是由很多益处的。

清楚将来发展

4、清楚将来发展。

web前端可以分为初级、中级、高级，初级绝对要熟练掌握div+css，中级要熟练掌握js，重点是掌握Jquery、angularJS。高级要掌握掌握面向对象编程思想、初级网站安全知识、配合后台开发人员实现产品界面和功能等，也有一部分转成专职程序员了，所以对于自己未来发展自己要规划清楚，杜绝稀里糊涂，要一天比一天好。

在线咨询

上一篇：手把手教你前端的各种文件上传攻略和大文件断点续传
下一篇：网页设计师给自己的儿子取名为“HTML”

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。