Web开发之HTML基本标签学习

最新推荐文章于 2024-03-17 19:44:32 发布

LWK_Vanish

最新推荐文章于 2024-03-17 19:44:32 发布

阅读量421

点赞数

分类专栏： Web开发文章标签： html 标签 web开发

本文链接：https://blog.csdn.net/lwk520136/article/details/57096574

版权

Web开发专栏收录该内容

20 篇文章 0 订阅

订阅专栏

本文根据慕课网视频整理：http://www.imooc.com/code/49
以下标签是基础标签：

标签	使用示例	备注
`<p>`	`<p>段落文本</p>`	将文字进行段落划分
`<hx>`	`<h1>标题</h1>`	x取值范围1-6，文字逐级减小，代表不同等级的标题
`<em>`	`<em>会变斜体的文字</em>`	表示强调，被包裹的文字会变斜体
`<strong>`	`<strong>会加粗的文字</strong>`	表示更加强烈的强调，被包裹的文字会变粗体
`<span>`	`<span>文字</span>`	为了设置单独的样式
`<q>`	`<q>被引用的文本</q>`	用于短文本/句子引用，被引用的对象会自动加上双引号
`<blockquote>`	`<blockquote>被引用的段落</blockquote>`	用于长文本的引用，被引用的文本左右会有缩进
`<hr>`或`<hr />`		空标签，无需成对存在，表示分割线，其中`<hr />`是html1.0版本写法 `<hr>`是html4.01版本写法
`<address>`	`<address>地址信息</address>`	展示地址信息，被包裹的文本会变斜体
`<code>`	`<code>一行代码</code>`	插入一行代码
`<pre>`	`<pre>多行代码</pre>`	插入多行代码，会保留代码区中的换行和空格
`<ul>`	`<ul>` `<li>条目</li>` `</ul>`	添加无序列表，每项li前会自带一个黑点
`<ol>`	`<ol>` `<li>条目</li>` `</ol>`	添加有序列表，每项li前会自带有序标签1. 2. 3.
`<div>`	`<div id="goods">` `<h2>`商品种类`<h2>` `<ol>` `<li>苹果</li>` `<li>橘子</li>` `<ol>` `</div>`	逻辑划分，将网页各部分划分为不同的逻辑块
`<table>`	`<table>...</table>`	整个表格以`<table>`开始，以`</table>`结束
`<tbody>`	`<tbody>...</tbody>`	如果表格内容没有被`<tbody>`标签包裹，表格会下载一点显示一点，但如果加上`<tbody>`标签后，这个表格就要等表格内容全部下载完才会显示
`<tr>`	`<tr>...</tr>`	表格中的一行，有几对`<tr>`就代表表格有几行
`<td>`	`<td>...</td>`	表格的一个单元格，一行中包含几对`<td>`，说明一行中就有几列
`<th>`	`<th>...</th>`	表格的头部的一个单元格，表格表头，表头内字体会加粗居中
`<summary>`	`<table summary="摘要"></table>`	给表格添加摘要，摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容
`<caption>`	`<table>` `<caption>标题<caption>` `</table>`	给表格添加标题
`<a>`	`<a href="http://www.baidu.com" title="点击进入百度" target="_blank">百度网址</a>`	添加超链接,`target="_blank"`代表在新窗口打开网页
`<a>`	`<a mailto="邮件地址?cc=邮件地址&bcc=邮件地址&subject=邮件主题&body=邮件内容">点我发邮件</a>`	注意：mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔 `<cc>`代表抄送地址，如果有多个用”;”隔开。`<bcc>`代表密件抄送地址，如果有多个用”;”隔开。`<subject>`代表邮件主题。`<body>`代表邮件内容
`<img>`	`<img src="图片地址" alt="加载失败后的替换文本" title="提示文本">`	图像可以是GIF，PNG，JPEG格式的图像文件