如何自学HTML

家好，我是自学web前端一直到现在，现在也可以做一个有颜色、有动画、布局的动态页面，这一路走来，很不容易，当然，也遇见过许多问题，最后都解决了，现在也可以称得上是一个入门级 “小白”，从基础的HTML、CSS、JavaScript到小程序，总结了很多的经验，给大家分享一下，大佬勿喷，有什么不对的地方请在下方评论。

HTML(网页)

web前端的基本概念。

WEB

web（world wide web）叫全球广域网，俗称万维网（www）。

W3C

w3c(world wide web consortium)叫万维网联盟，是国际最著名的标准化组织，制定了web标准。

1：HTML基础首先要做的当然是做自己的第一个网页了，比如说在网页上写一段话

打开网页看到下面这个效果：

2：字体大小（font-size）、字体粗细（font-weight）、隔行（br/）、表单（form）、表格（table)等等，还有很多，大家慢慢积累吧。

但是身为“小白”的我要告诉大家，不要在HTML基础上面浪费太多的时间，尽可能在一个月内就把HTML给熟练掌握。如果你打算从事web前端工作，需要学的东西还有很多，基础一定要牢固，多敲代码、多记。好了，后续我还会分享关于这方面的知识点，大家有什么问题都可以在下方评论。

多朋友想学一下网页制作，上网一看，只要涉及到网页制作，都离不开HTML这个词语，HTML是HyperText Markup Language的简称，想学习HTML语言，先得了解一些基本知识，今天这边内容可以作为学习HTML的菜鸟教程第一课。

HTML是什么？

一般我们说HTML是指超文本标记语言，英文名称为HyperText Markup Language，简称HTML，它是目前互联网上应用最广泛的语言。

如何查看HTML？

拿最常见的网页为例，如果用大家熟悉的IE浏览器的话，直接在网页上点右键，选择“查看源”即可查看当前网页的HTML源码；如果是其他浏览器的话，多数情况下点击右键，选择“查看源码”或者类似“查看网页源代码”这样的选项即可查看。

当然也可以通过专业的网页制作软件以及各种文本编辑器来查看。

HTML有什么用？

HTML语言可以方便地将网络上存储于不同位置的文字、图片、声音、视频等内容组织起来，方便用户浏览。对于我们来说，HTML是学习网页制作的基本功，熟练掌握HTML这项基本功，可以为以后的学习和工作打下良好的基础。

HTML如何入门？

要学习任何编程语言，都不好好高骛远，HTML的入门很简单，但是也要遵循学习的基本步骤，选择一本入门书籍，循序渐进地去学习每一张的内容。一边学习，一边查看网页代码对照来学，提升入门速度。

HTML案例

下面就是最基本的HTML案例，在这个案例中，用的是HTML5，

<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元（meta）数据，如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
<title> 描述了网页的标题
<body> 元素包含了可见的页面内容，因为下面是最简单的案例，所以只有几行，实际网页一般都有很多行。
<h1> 定义一个大标题
<p> 元素定义一个段落，也就是大家常说的分段。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML菜鸟教程(runoob.com)</title>
</head>
<body>
    <h1>我的第一个标题</h1>
    <p>我的第一个段落。</p>
</body>
</html>

如何编辑HTML?

这个就很多了，比如最出名的Dreamweaver，当然如果熟练之后，可以选择任意自己喜欢的编辑器，一些小的改动或者一小段代码的话，也可以用各种常见的文本编辑器来处理，比如我们在wodows系统上常见的记事本，总之只要自己觉得方便就好。

总结

以上是学习HTML菜鸟教程的第一课，首先保持一个良好的心态来学习，有好的心态，知识方面只要循序渐进，学会就是水到渠成的事情了。

一篇介绍了网页的基本结构，那如何编写网页的内容? 前提是要学会HTML标签的用法，本篇主要介绍HTML标签是什么，如何学习，需要大概多长时间学习。

本篇主要基于html5介绍，html5 是最新版的标准，之前的版本可以自己了解下。

HTML 简介

HTML的英文全称是Hyper Text Markup Language，直译为超文本标记语言。它是全球广域网上描述网页内容和外观的标准。HTML包含了一对打开和关闭的标记，在当中包含有属性和值。标记描述了每个在网页上的组件，例如文本段落、表格或图像等。

事实上，HTML是一种因特网上较常见的网页制作标注性语言，而并不能算做一种程序设计语言，因为它缺少程序设计语言所应有的特征。HTML通过IE等浏览器的翻译，将网页中所要呈现的内容、排版展现在用户眼前。

一个html标签基本结构如下：

<标签名称  属性="属性值"></标签名称> 或 <标签名称 属性="属性值"/>

有以下特点：

由尖括“<”、“>”号包围的标记元素，比如 <html>和</html>就是一对标记。
通常是成对出现的，比如 <div> 和 </div>，也有单独呈现的标签，如：<img />、<input/>等。
标签对中的第一个标签是开始标签，第二个标签是结束标签；
一般成对出现的标签，其内容在两个标签中间，如<h1>标题</h1>。单独呈现的标签，则在标签属性中赋值，如<input type="text" />。
网页展示的内容需写在<body>标签中。
标签不区分大小写，建议按规范小写。

HTML标签按功能大体可分以下几种类型：

构成网页基本架构的标签，比如：<!DOCTYPE>（定义文档类型）、<html>(根标签),<meta>（元信息）、<head> (网页头部区域)、<body> （网页内容区域）。
用于引入外部资源及客户端脚本的标签，比如：<link>（外部资源，css样式文件）， <script>（客户端js脚本）。
用于描述布局的标签，比如： <div>、<ul>（无序列表）、<ol>（有序列表）、<h1>到<h6>（标题1到6）、<table>（表格）、<footer>（页脚）、<header>（页头）等。
用于描述文本格式的标签，比如：<p> (段落)、<strong>(加粗)、<q>（引用）、<span>等。
用于引入多媒体资源的标签，比如：<img>、<video>、<audio>等。
用于制作表单的标签，比如：<form>(表单),<input>(输入框),<textarea>(文本域)，<select>(下拉菜单),<radio>(单选项),<checkbox>(多选项)等。
其它标签（不是很常用的）。

如何学习html的标签用法

没有捷径，需要多看，多练。在这里我不一一介绍每个标签的具体含义及用法，相关语法可以参考以下几个网站：

https://www.w3cschool.cn/html5/
https://developer.mozilla.org/zh-CN/docs/Web/HTML

制定一个学习计划,每天坚持下去

要求，每天花费3到5个小时学习，至少1到2周掌握常用的html标签含义及用法，可以按照上面介绍的标签进行分类学习，感谢关注，祝你学习愉快。

在线咨询

上一篇：开发者指南如何在MyEclipse中编辑HTML或JSP文件？（一）
下一篇：CSS样式表之空白处理

您的项目需求

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

整合营销服务商

如何自学HTML

HTML 简介

HTML标签按功能大体可分以下几种类型：

如何学习html的标签用法

您的项目需求