HTML常用标签

目    录

一、标签属性​

二、排版标签​

1.标题标签 h1-h6

2.文字上的分隔标签 br和p

3.水平线标签 hr

基本语法格式：

水平线标签的标签属性：

4.文字居中标签 center

5.div 和 span 标签 

6.排版标签总结

三、文本格式标签​

1.文字变化标签（如加粗等等）

 2.字体标记 font

四、图像标签 img​

 图像标签的标签属性如下：

五、特殊字符​

六、注释标签  !--  --​

---

一、标签属性

        所谓属性就是外在特性，比如你的手机颜色，尺寸等等。使用HTML制作网页时，可以对HTML标签的属性加以设置。后面会了解到标签的各种属性，目前先了解一下设置标签属性的格式。其基本语法格式:<标签名 属性1="属性值1" 属性2="属性值2" …> 内容 。有的标签有自己特殊的属性，有的属性也使用于很多标签！需要注意的是：

• 一个标签可以拥有多个属性并且必须写在开始标签中，位于标签名后面。
• 属性之间不分先后顺序，标签名与属性、属性与属性之间均以空格分开。
• 采取 键值对 的格式 key="value" 的格式

二、排版标签

1.标题标签 h1-h6

HTML提供了6个等级的标题哦！其基本语法格式如下：

<h1>   标题文本1   h1>
<h2>   标题文本2   h2>
<h3>   标题文本3   h3>
<h4>   标题文本4   h4>
<h5>   标题文本5   h5>
<h6>   标题文本6   h6>

效果展示:加了标题的文字会变的加粗，  h数越大字号越小  ，也就是h1为最大字号，h6为最小字号，还有一点就是  一行只能放一个标题  哟。

2.文字上的分隔标签 br和p

(1)

标签

        p来源于paragraph 段落这个单词的首字母。可以把 HTML 文档以及整个网页分割为若干段落。段落标签是HTML文档中最常见的标签，默认情况下，文本在一个段落中会根据浏览器窗口的大小自动换行。

(2)换行标签

        在HTML中，一个段落中的文字会从左到右依次排列，直到浏览器窗口的右端，然后自动换行。如果希望某段文本强制换行显示，就需要使用换行标签。这时如果还像在word中直接敲回车键换行就不起作用了。

(3)效果演示(这些标签代码都写在body标签里面的哈！)

<p>小 笑 话p>
		
<p>家人给表弟安排了一场相亲，见面时女方对他印象不错羞涩地说：“我不介意你没有房，没有车，没有存款，只要你对我好就行!”<br />结果这货来了句：“你肚子里不会是有赠品吧!?”p>
		
<p>女友给男友买了两条领带作为生日礼物。第二天早上，男友高高兴兴地系上一条新领带。<br />女友见了怒曰：“你什么意思，你是不是不喜欢另外一条啊!”p>
		
<p>我男友很爱我，什么事都会为我着想。今天第一次去他家，我担心我脱了高跟鞋会让他父母看出来我太矮了。<br />他一把揽过我，一脸灿烂：“没事，我早就告诉他们你有脚臭不能脱鞋了。”p>

效果展示： 

3.水平线标签 hr

        在网页中常常看到一些水平线将段落与段落之间隔开，使得文档结构清晰，层次分明。这些水平线可以通过插入图片实现，也可以简单地通过标签来完成，

---

就是创建横跨网页水平线的标签并且改标签是单标签哦。

基本语法格式：

<p>“栓Q”这个词最早来源于广西桂林阳朔县的70后农民刘涛，他用中英文双语介绍桂林阳朔山水，最后演唱了《row row row your boat》（漏漏漏之歌），结尾处用略显搞笑的发音说了“栓Q”，由此引发全网关注，迅速成为了一个全网流行的网络梗。p>
		 <hr color="red"  width="240"  size="2">
		 		<p>栓Q是“‌‌‌‌‌‌‌‌‌‌‌‌thank you”的谐音，意为‌‌‌‌‌thank you空耳版本。渐渐与“我真的会谢”组合，用来表达无奈、下头、阴阳等。“栓Q我真的会谢”字面意思是我是真的谢谢你，另一种意思表示很无语很郁闷。p>

水平线标签的标签属性：