HTML基本元素(一)
1.换行符
<br />
Ps:br 是换行(Break)的缩写,文本会在这个标签的地方换行。
实例:
第一行<br />第二行
2.段落
<p>这是一个段落</p>
属性 | 说明 |
align | 行对齐方式(left,center,right) |
实例:
<p>这是第一个段落</p>
<p>这是第二个段落</p>
<p>这是第三个段落</p>
3.标题
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
Ps:<h1>定义最大标题,<h6>定义最小标签
实例:
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
效果如下:
标题1
标题2
标题3
标题4
标题5
标题6
4.水平线
<hr />元素可用于分隔内容。
属性 | 说明 |
size | 指定线的粗细(px) |
width | 指定线的长度(px或%) |
align | 行对齐方式(left,center,right) |
实例:
<hr size="5" width="50%" align="center"/>
5.文本格式化
<b>定义粗体文本</b>
<i> 定义斜体文本 </i>
<s>定义删除文本</s>
<del>定义删除文本</del>
<u>定义下划线文本</u>
<sup>定义上标字</sup>
<sub>定义下标字</sub>
效果如下:
定义粗体文本
定义斜体文本
定义删除文本
定义下划线文本
定义上标字
定义下标字
6.预格式文本
<pre>标签可以保留文字在源代码中的格式,使得页面中显示的内容和源代码中的格式一致。
实例:
<pre>
春晓
春眠不觉晓,处处闻啼鸟。
夜来风雨声,花落知多少。
</pre>
效果如下:
春晓
春眠不觉晓,处处闻啼鸟。
夜来风雨声,花落知多少。
7.字体
<font>这是一段文字</font>
属性 | 说明 |
size | 定义字体大小 |
face | 定义字体 |
color | 定义字体颜色 |
实例:
<font size="5" face="宋体" color="red">这是一段文字</font>
Ps:三种颜色表达方式
1.16进制的模式:#000000,#ffffff
2.单词模式:red,green,blue
3.RGB模式:rgb(10,20,30) 0-255
8.链接
<a href="http://~">外部链接 </a>
<a href="~.html">内部链接 </a>
<a href="mailto:邮箱地址">邮件链接</a>
<a href="tel:电话号码">一键拨打</a>
<a href="sms:手机号码">一键发送短信</a>
属性 | 说明 |
href | 定义链接地址 |
title | 链接提示信息 |
target | 链接打开方式(_self,_blank,_top) |
Ps:_self 在当前的浏览器窗口打开
_blank 在新建的窗口里面打开
_top 在*框架里面打开
9.锚点
锚点标签用于使用户"跳"到文档的某个部分。
<a href="#位置名"> ~ </a>
(此标签放在起始地)
<a name="位置名"> ~ </a>
(此标签放在目的地)
实例:
<body>
<a name="top"></a> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a href="#top">回到顶部</a>
</body>
10.HTML注释
可以将注释插入 HTML 代码中,这样可以提高其可读性,使代码更易被人理解。
合理地使用注释可以对未来的代码编辑工作产生帮助。
HTML注释快速生成方式:选中目标+Ctrl+/
如:<!-- This is a comment -->
拓展:两条斜杠 (//) 是 JavaScript 注释符号
如:// This is a comment