我在慕课网所学到那些html标签

347 查看

HTML组成部分

一、头部(固定格式)

二、内容<body>...</body>

1、标题
<h1~h6>...</h1~h6>：标题字体大小依级递减。

2、内容

①<p>...</p>：段落文本。段前段后默认留一行空白

②<div>...</div>:独立的逻辑部分。可划分独立板块。（<div id="XXX">）

③<span>...</span>:没有语义，为了设置单独的样式用的。

注释：一般来说，<div>里可嵌套<p>，<p>里可嵌套<span>。

文本常出现标签
<a>...</a>:超链接。如<a href="http://www.XXX.com" title="...">...</a>。

注释：<a>标签中target属性：<a href="..." target="_blank">...</a>表示在新的浏览器窗口中打开。

（<a href="mailto:XX@imooc.com;XX2@imooc.com?cc=抄送地址&bcc=密件抄送地址&subject=邮件主题&body=邮件内容">发送</a>）

<address>...</address>:地址信息。
<code>...</code>:添加一行标签。
<pre>...</pre>:预格式化的文本。被包围在pre元素中的文本通常会保留空格和换行符。（可填入代码）

关键词、关键句设置标签
<em>...</em>:表示强调语气。
<strong>...</strong>:表示更强烈的强调。
<q>...</q>:短文本引用。语义：引用别人的一句话。
<blockquote>...</blockquote>:长文本引用。语义：引用别人的一段话。

格式标签
<br />:换行
<hr />:水平横线
:空格

列表标签：
ul-li:没有前后顺序的信息列表。（<ul>...<li>..</li><li>..</li>...</ul>）
ol-li:有前后顺序的信息列表。（<ol>...<li>..</li><li>..</li>...</ol>）

表格标签：table、tbody、tr、th、td
<table>...</table>:整个表格以<table>标记开始，以</table>标记结束。
<tbody>...</tbody>:当表格内容过多时，表格会下载一点显示一点；<tbody>标签的作用是等表格内容全部下载完才显示。
<tr>...</tr>:表格的一行
<th>...</th>:表格的头部的一个单元格，表格表头。默认为粗体并居中。
<td>...</td>:表格的一个单元格
例如：<table><tbody>...<tr><th>..</th></tr>..<tr><td>..</td></tr>...</tbody></table>。

注释：<table>属性：summary="...（表格的摘要）"，如<table summary="...">
<caption>...</caption>:表格标题

表单标签：
<form method="传送方式(get/post)" action="服务器文件">...</form>
注释：form表示标签，action表示浏览者输入的数据被传送的地方，method:数据传送的方式（get/post）

<label>...</label>:作用是为鼠标用户改进可用性。如果你在<label>标签内点击文本，就会触发此空间。
PS：label标签中的for：for属性的值应当与相关控件的id属性值一定要相同。

<input... />:<input type="text(文本输入框)/password(密码输入框)/radio(单选框)/checkbox(复选框)/submit(提交按钮)/reset(重置按钮)" value="..." name="..." />

注释：

当type="radio"时，即同一组的单选按钮，name取值要一致。

value:提交数据到服务器的值；文本输入时，value可改成placeholder，placeholder的特点：鼠标键入后提示依然在，输入内容后提示消失。

name:为控件命名；checked：当checked="checked"，表示该选项被默认选中。

下拉列表框：
<select>
<option value="向服务器提交的值" id="..">显示的文本</option>
<option value=".." selected="selected">...</option>
</selected>
注释：selected="selected"，则该选项就被默认选中。