HTML的基础标签

一.基础标签

1.h 标签 （标题标签）

一共有六级标题标签，从h1到h6，由大到小。一般的页面中，只写一个h1标签。

使用方法：        <h1>这是⼀个h1标签</h1>

2.p 标签  （段落标签）

用来表示一个段落，其中的文字会独占一行，并且段与段之间会有间距。

使用方法：<p> 段落 </p>

3.br 标签  (换行标签)

使用方法：<br>

4.hr 标签 （分割线标签）

分割线标签使用后，分割线以下的标签样式就不会继承分割线以上既定的样式了

使用方法：<hr>

5.img 标签 （图片标签）

src:设置⼀个图片的路径（绝对路径和相对路径，最好使⽤相对路径）

alt:可以用来设置在图片不能显示的时，对图片的描述

img标签的其他属性

width:设置图片的宽度  height:设置图片的高度 这两者也可以设置一个 另一个就成比例改变

title：用于告诉浏览器，鼠标标悬停的时候，需要弹出的描述框中显示什么内容

style="text-align: center;设置这个无效 因为这是一个行内元素，要想使其居中，则需要将其通过div块包裹然后设置style="text-align: center；就可以达到居中效果。

使用方法： <img src="图⽚的url或本地路径地址" alt="" width="100px" height="100px" title="">

6.a 标签 （控制页面与页面之间跳转的）

（1）外部链接跳转

eg: <a href="https://www.baidu.com" target="_blank" title="百度">百度⼀下</a>

（2）内部文件跳转

eg:<a href="指定需要跳转的⽬标界⾯">需要展现给⽤户查看的内容</a>

（3）target属性

self:用于当前的选项卡中进⾏跳转，即在本页面中进行跳转，默认就是这个。

blank:用于在新的选项卡中进⾏跳转，即跳转到新的页面。

（4）发送邮件

使用方法：<a href="mailto:name@email.com">Email</a>

其他参数： cc= name@email.com  抄送地址

                   bcc= name@email.com 密件抄送地址

                   subject=subject text         e-mail的题目

                    body=body text                e-mail的内容

                        第一个参数符合是？其他是&

（5）base 标签

必须要写在head标签之间，用来统⼀指定当前页面中所有的a标签需要如何打开

使用方法：<base target="_blank">

（9）锚点

通过设置id值来进行锚点指向

使用方法：<a href="#50">div50</a>本页面  此时这个div50的id值就是50，通过#50进行锚点指向

                  <a href="./其他页面.html#div50">div50</a> 其他页面  通过路径进行访问其他页面的id值。进行锚点指向。

（10）假链接

1.# 直接回到页面的顶部   <a href="#">回到顶部</a>

2.javascript: 不会自动回到页⾯的顶部  <a href="javascript:">测试</a >

7.video 标签 （视频标签）

 controls ：控制条小窗口都有了src:告诉video标签需要播放的视频地址
 autoplay: 用于告诉video标签是否需要⾃动播放视频，但是现在的浏览器即使设置了也会禁止自动播放，不少浏览器会访问权限。
 controls: 用于告诉video标签是否需要控制条
 poster: 用于告诉video标签视频没有播放之前显示的占位图片，先展示图片
 loop: ⼀般用于做广告视频，用于告诉video标签视频播放完毕之后是否需要循环播放
 muted:静音播放
 width/height: 和img标签中的⼀模⼀样，可以单独设置，会自动成比例使用

使用方法：<video  controls autoplay src=""  poster="" loop muted></video>

8.audio 标签  （音频标签）

audio 标签的使用和 video 标签的使用基本⼀样 , video 中能够使用的属性 在audio 标签中⼤部分都能够使用 , 并且功能都⼀样 ，只不过有3 个属性不能用 , height/width/poster。

使用方法：<audio ontrols autoplay src="" poster="" loop muted></audio>