HTML标签详解-优快云博客

本文链接：https://blog.youkuaiyun.com/kakascx/article/details/53174090

了解标签

<em>表示强调，在浏览器中以斜体显示；
<strong>比<em>语气更强，以粗体显示；
<span>没有意义，目的是为了单独设置样式，例如
<span style="color:blue">美国梦</span>，设置美国梦的字体颜色为蓝色；
<q>表示短引用，浏览器自动对引用的文本加双引号
<blockquote>表示长引用，浏览器对引用文本采取缩进样式；
<br/>标签分行显示文本，在需要回车的地方输入，html语言自动忽略空格和回车；
 表示输入一个空格，不要忘记了那个分号；
<hr>或<hr/>表示添加水平横线，由于是空标签，所以只有开始标签没有结束标签，线条的颜色和粗细用CSS修改；
<address>中的内容表示地址，签名等，默认为斜体，可以使用css修改样式；
<code>标签表示插入一行代码，注意不能是多行
<pre>表示插入代码块，被包围在 pre 元素中的文本通常会保留空格和换行符。
<ul>-<li>添加信息列表，ul-li是没有前后顺序的信息列表。语法：
```
<ul>
  <li>信息</li>
  <li>信息</li>
   ......
</ul>
```
ul-li在网页中显示的默认样式一般为：每项li前都自带一个圆点
<ol>表示有序列表，语法如下：
```
<ol>
   <li>信息</li>
   <li>信息</li>
   ......
</ol>
```
每项list之前自动添加序号1,2,3。。。
<div>标签相当于一个容器，划分出独立的逻辑部分。为了使逻辑更加清晰，我们可以为这一个独立的逻辑部分设置一个名称，用id属性来为<div>提供唯一的名称,例如：<div id="版块名称">...</div>;
<table>标签显示网页上的表格，例如：

<table>
  <tbody>
    <tr>
      <th>班级</th>
      <th>学生数</th>
      <th>平均成绩</th>
    </tr>
    <tr>
      <td>一班</td>
      <td>30</td>
      <td>89</td>
    </tr>
    <tr>
      <td>二班</td>
      <td>35</td>
      <td>85</td>
    </tr>
    <tr>
        <td>三班</td>
        <td>32</td>
        <td>80</td>
    </tr>
</tbody>
</table>

其中包含几类标签，

<table>...</table>标记表格的内容；
<tbody>...</tbody>当表格内容非常多时，表格会下载一点显示一点，但如果加上标签后，这个表格就要等表格内容全部下载完才会显示;
<tr>表格的一行
<th>代表表头
<td>表示一个单元格，意味着一列

备注：

table表格在没有添加css样式之前，在浏览器中显示是没有表格线的
表头，也就是th标签中的文本默认为粗体并且居中显示

在<head>标签中添加css样式，可以修改表格的边框，例如：

<style type="text/css">
table tr td,th{border:1px solid #000;}
</style>

表示为表格添加粗细为一个像素的黑色边框。

<caption>标签为表格添加标题，用以描述表格内容，标题的显示位置：表格上方。
表格的summary属性为摘要，摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。

Html学习笔记（2）

了解标签