HTML常用标签

HTML入门指南

最新推荐文章于 2025-09-10 16:16:57 发布

林尧彬

最新推荐文章于 2025-09-10 16:16:57 发布

阅读量84

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/cchHers/p/9844138.html

本文介绍HTML的基本概念和常用标签，展示了如何使用这些标签进行文本格式化、添加图片、创建链接及表格等内容，是初学者理解HTML如何构建网页结构的良好资源。

HTML（HyperText Markup Language）--超文本标记语言。

看这个名字就知道，它的易学性质。回想下平时用word写文档的时候，内容可以由文字、图片、音视频组成，格式方面有字体、颜色、大小、换行等等，这些都可以用HTML语言标识出来。当然标识的方式有很多，现在的markdown语法也是可以起到标识的作用，区别是HTML是运行在浏览器上，由浏览器来解析。换句话说就是如果想把丰富的文档在浏览器上表现出来，就使用HTML来书写。

既然是标记语言，首先学习它的各种标记方式，就像使用word时先打量下word的工具栏有哪些可配置参数。大致了解后肯定就是要实际使用起来，“试一试看看效果”的反馈学习方式加上回忆使用word的过程结合起来学习HTML无疑是一条比较好的道路。

一、HTML常用的标签符号与对应的格式名称，有个大致的印象而已

<html>	HTML文档	</html>	备注
<head>	头部	</head>	备注
<body>	文档主体	</body>	备注
<title>	文档标题	</title>	备注
<h1>	一级标题	</h1>	h1～h6
<p>	段落	</p>	备注
<a>	链接	</a>	普通的链接： <a href="http://www.example.com/">链接文本</a> 图像链接： <a href="http://www.example.com/"><img src="URL" alt="替换文本"></a> 邮件链接： <a href="mailto:webmaster@example.com">发送e-mail</a> 书签： <a id="tips">提示部分</a> <a href="#tips">跳到提示部分</a>
<img/>	图像		<img src="/images/logo.png" width="258" height="39" />
<br/>	换行		备注
<hr/>	水平线		备注
<!--...-->	注释		备注
<b>	粗体文本	</b>	一般使用<strong>
<i>	斜体文本	</i>	一般使用<em>
<table>	表格	</table>	<table border="1"></table>
<tr>	表格中的行	</tr>	备注
<td>	表格中行的列	</td>	备注
<ul>	无序列表	</ul>	备注
<ol>	有序列表	</ol>	备注
<li>	无、有序列表的节点	</li>	备注
<dl>	自定义列表	</dl>	备注
<dt>	自定义列表项	</dt>	备注
<dd>	自定义列表项的定义	</dd>	备注
<div>	块级	</div>	<div id="container" style="width:500px">
<span>	内联元素	</span>	备注
<meta>			<meta charset="utf-8">
<!DOCTYPE>			<!DOCTYPE html>
<form>	表单	</form>	备注
<input>	输入元素	</input>	<input type="text">文本域、<input type="password">密码字段、 <input type="radio">单选按钮、<input type="checkbox">复选框、 <input type="submit">提交按钮
<iframe>	框架	</iframe>	<iframe src="URL"></iframe>
<script>	脚本	</script>	备注
<noscript>		</noscript>	备注
<code>	计算机代码	</code>	备注
<kbd>	键盘输入	</kbd>	备注
<pre>	预格式化文本	</pre>	备注
<abbr>	缩写	</abbr>	备注
<bdo>	文字方向	</bdo>	备注
<address>	联系信息	</address>	备注
<del>	删除的文本	</del>	备注
<ins>	插入的文本	</ins>	备注
<sub>	下标文本	</sub>	备注
<sup>	上标文本	</sup>	备注
<cite>	工作的名称	</cite>	备注
<l>		</>	备注

二、现在就使用一些这些常用的标签，看看效果

HTML常用标签的效果展示

三、总结

HTML是一种在Web上使用的通用标记语言。HTML允许你格式化文本，添加图片，创建链接，输入表单，框架和表格等等，并且可将之存为文本文件，浏览器即可读取和显示。
HTML的关键是标签，其作用是指示将出现的内容。简单的使用HTML用用这些标签其实也就够了，其实还可以往HTML的标签上添加属性，比如颜色等。 Web开发时，通过使用CSS，所有的格式化均可以从HTML中剥离出来，并存储于一个独立的文件中。这就是为什么HTML负责内容，CSS负责样式的设计模式。
另外使用HTML+CSS虽然已经能够将内容很好的展示出来了，这也就是静态网页。但是这样的界面缺少于用户的交互或者是网页自身的生动。如果要达到这样的效果的化，还需要使用JavaScript技术。JavaScript是互联网上最流行的脚本语言，目前所有的主流浏览器都支持JavaScript

另外，如果使用HTML（内容）+CSS（样式）+JavaScript（交互）这三种技术的结合就已经能够完成网站的搭建工作了。但是到目前位置它还只是能够运行在本地，如果想让更多人通过互联网就能够访问的话，还需要一个服务器来托管自己写好的网站。

转载于:https://www.cnblogs.com/cchHers/p/9844138.html