[HTML/HTML5] 零基础学习web前端（一）之HTML标签1

Amy

零基础学习web前端（一）之HTML标签1

【零基础学习web前端】教程目录导航   http://www.sufeinet.com/thread-24027-1-1.html


     上个帖子我简单介绍了下HTML标签，HTML常用的标签并不多，但需要我们牢牢记住标签的用法，这里我罗列了一些经常用到的标签，也附带些效果，希望能对零基础学习前端的朋友有所帮助。有新的标签我也会加进来，大家记得关注我哦！

1、注释标签

---

[HTML] 纯文本查看 复制代码

<!-- 这是一行注释-->

2、水平线标签

---

[HTML] 纯文本查看 复制代码

我是一个水平线<hr>

示例
     
  hr标签属性：<hr width="宽度值"  size="高度"  color="颜色"  align="对齐方式"  >
3、标题标签

---

[HTML] 纯文本查看 复制代码

<h1>我是标题</h1>
<h2>我是标题</h2>
<h3>我是标题</h3>
<h4>我是标题</h4>
<h5>我是标题</h5>
<h6>我是标题</h6>

示例
         

4、换行标签

---

[HTML] 纯文本查看 复制代码

段落1<br/>
段落2

效果


5、段落标签

---

[HTML] 纯文本查看 复制代码

<p>我是一个段落</p>
<p>我是另一个段落</p>

效果


6、文字标签

---

[HTML] 纯文本查看 复制代码

<font>我是文本内容</font>

• font属性：<font color="" size="" ></font>
  

[HTML] 纯文本查看 复制代码

<font color="red" size="24px">我是文本内容</font>

效果
     

7、文本加粗标签

---

[HTML] 纯文本查看 复制代码

<b>字体加粗</b>
<strong>加重语气</strong>

效果

注：尽量用<strong>

8、文本倾斜标签

---

[HTML] 纯文本查看 复制代码

<em>文本倾斜</em>
<i>斜体</i>

示例
   
注：尽量用<em></em>

9、删除线标签

---

[HTML] 纯文本查看 复制代码

<del>删除字</del> 
<s>删除这行字</s>   

效果  
  
注：尽量用<del></del>


10、下划线标签

---

[HTML] 纯文本查看 复制代码

<ins>插入字</ins>   
<u>字体加下划线</u>  

效果

注：尽量使用<ins>

11、上下标

---

^{内容设置成上标}    _{内容设置成下标}

[HTML] 纯文本查看 复制代码

4<sup>3</sup>
A<sub>my</sub>

示例  

范范

内容不错， 都是真材实料呀

范范

楼主加油，我们都看好你哦。

惜

见证一个前端大牛 开始一步步崛起

wx_zep1LVr2

写的不错，加油

Amy

先罗列了这么多 我会持续发帖 希望对大家有所帮助

站长苏飞

格式排的很漂亮，一看就是做这行了。