学习HTML标签,要从标签的用途、标签在浏览器中的默认样式入手,已经深刻了解其语义。
语义化:在什么情况下可以使用这个标签才合理
1. 更容易被搜索引擎收录。
2. 更容易让屏幕阅读器读出网页内容。

一、p标签

<p>段落文本</p>
<p>标签的默认样式,段前段后都会有空白,如果不喜欢这个空白,可以用css样式来删除或改变它。

二、hx标签

<hx>标题文本</hx>
标题标签一共有6个,h1、h2、h3、h4、h5、h6分别为一级标题、二级标题、三级标题、四级标题、五级标题、六级标题。并且依据重要性递减。一般<h1>标签被用在网站名称上。

三、强调标签

<em>需要强调的文本</em>  
<strong>需要强调的文本</strong>
<em> 默认用斜体表示,<strong> 用粗体表示。<strong>更强烈,较为通用。

四、使用<span>标签为文字设置单独样式

<span>文本</span>

五、文本引用

<pre name="code" class="html"><q>引用文本</q>		<!-- 短文本引用-->
<blockquote>引用文本</blockquote>	<!-- 长文本引用、缩进样式-->
引用标签的真正关键点不是它的默认样式双引号,而是它的语义:引用别人的话。

六、div

在网页制作过程过中,可以把一些独立的逻辑部分划分出来,放在一个<div>标签中,这个<div>标签的作用就相当于一个容器。

七、table

<th>…</th>:表格的头部的一个单元格,表格表头。<tbody>…</tbody>:当表格内容非常多时,表格会下载一点显示一点,但如果加上<tbody>标签后,这个表格就要等表格内容全部下载完才会显示。如右侧代码编辑器中的代码。1、table表格在没有添加css样式之前,在浏览器中显示是没有表格线的2、表头,也就是th标签中的文本默认为粗体并且居中显示3、为表格添加标题和摘要
<caption>标题文本</caption>
<table summary="表格简介文本">
摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化),使搜索引擎更好的读懂表格内容,还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。

八、<a>标签

<a href="目标网址" title="鼠标滑过显示的文本" target="_blank">链接显示的文本</a>
title属性在实际网页开发中作用很大,主要方便搜索引擎了解链接地址的内容
如果mailto后面同时有多个参数的话,第一个参数必须以“?”开头,后面的参数每一个都以“&”分隔
<a href="mailto:lg@qq.com?cc="381510688@qq.com&bcc=750@qq.com&subject=主题&body=邮件内容">发送</a>
注意:主题和body内容无需使用''进行隔离
HTML基础标签_HTML基础标签

九、<img>标签

<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">

十、<form>表单标签

<form method="传送方式" action="服务器文件">
<label for="控件id名称">
label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。


回车:<br />
空格: 
水平线:<hr />
地址信息:<address>地址信息</address>
单行代码:<cod>代码</code>
多行代码:<pre>代码段</pre>

无前后顺序:每项<li>前都自带一个圆点
<ul>
  <li>信息</li>
  <li>信息</li>
   ......
</ul>

有前后顺序:每项<li>前都自带一个序号,序号默认从1开始
<ol>
   <li>信息</li>
   <li>信息</li>
   ......
</ol>

下面这些标签可用在 head 部分:
<head>
    <title>...</title>	
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link>
    <style>...</style>
    <script>...</script>
</head>

<!-- 网页的title标签用于告诉用户和搜索引擎这个网页的主要内容是什么,搜索引擎可以通过网页标题,迅速的判断出网页的主题。-->