HTML基本标签集合

最新推荐文章于 2022-07-02 23:07:53 发布

main--

最新推荐文章于 2022-07-02 23:07:53 发布

阅读量474

点赞数 5

分类专栏： HTML

本文链接：https://blog.csdn.net/qq_41420688/article/details/89332053

版权

HTML 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

一、文本标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>文本标签</title>
	</head>
	<body>
		<!--
			标题标签
			h1-h6:标题由大到小
			快捷键：alt+/:代码提示
			ctrl+shift+R:复制行
			ctrl+shift+/:
		-->
		<h1>标题</h1>
		<h2>标题</h2>
		<h3>标题</h3>
		<h4>标题</h4>
		<h5>标题</h5>
		<h6>标题</h6>
		<!--段落标签-->
		第一行
		第二行
		<p>第一段(段落标签)</p>
		<p>第二段(段落标签)</p>
		<blockquote>段落缩进</blockquote>
		<!--字体标签-->
		<b>加粗标签</b><br />
		<strong>加粗标签（带“语义”）</strong><br />
		<i>斜体标签</i><br />
		<em>斜体标签（带“语义”）</em><br />
		<hr />水平线标签
		<!--原样输出标签-->
		<pre>
			原样输出标签
			  静夜思
			   李白
			床前明月光，
			疑是地上霜。
			举头望明月，
			低头思故乡。
		</pre>
		<!--换行标签-->
		<br />换行标签
		<!--上下标标签-->
		上标标签：x^2 : x<sup>2</sup> <br />
		下标标签：H2O  :H<sub>2</sub>O
		
		<!--滚动标签
			滚动标签：marquee
		属性：behivor
		属性值：alternate :来回滚动
				scroll:交替滚动
				slide：滚动一次，默认从右到左
		-->
		<marquee>滚动标签（不写标签属性，默认来回滚动）</marquee>
		<marquee behavior="alternate">来回滚动</marquee><br />
		<marquee behavior="scroll">交替滚动</marquee>
		<marquee behavior="slide">滚动一次，默认从左到右</marquee>
		<!--块标签div(占一行）和行内标签span(在一行)-->
		<div>块标签1</div>
		<div>块标签2</div>
		<span>行内标签1</span>
		<span>行内标签2</span>
	</body>
</html>

运行结果：
在这里插入图片描述

二、列表标签

有序列表和无序列表

ul：无序列表标签

属性type：无序列表的类型
disc：默认的（实心圆点）
circle：空心圆点
square：小正方形（实心的）

li ：列表项

ol:有序列表
属性type：指定当前的有序列表类型
在这里插入图片描述

运行结果：

三、超链接标签

a标签

1.属性:
href ：链接的URL地址
target：打开链接文件的方式
常用两个属性值：_self:当前窗口直接打卡/_blank:新建窗口打开
2. 常见的协议:

		      file://  本地文件协议
		      http://  http协议
		          在当前本地找对应的hosts文件,找打了直接打开,如果没有,就调用网卡联网操作,中间DNS服务器中找!
		      jdbc://mysql:///数据库名称
		      thunder:// 迅雷协议
		      email: 邮件协议
<a href = "http://www.baidu.com" target="_blank">链接到百度</a>

3.使用场景：
1. 跳转到指定的文件:普通使用
2. 作锚链接使用

a)在同一页面中使用锚链接
              1)打锚点:跳转标记
                                超链接的name属性
              <a name="锚点(标记)名称"></a>
              2)进行跳转链接
    <a href="#锚点(标记)名称">开始跳转</a>
b)在不同页面中使用锚链接
              1)打锚点:跳转标记
                                超链接的name属性
              <a name="锚点(标记)名称"></a>
               2)进行跳转链接
    <a href="#连接的资源文件#锚点(标记)名称">开始跳转</a>