HTML中添加超链接、音频标签、视频标签、内嵌框架标签

目录

超链接

音频标签

视频标签

内嵌框架标签

超链接

1.超链接:当用户点击文字、图像、视频等页面元素时,页面会发生跳转,则这些页面元素就是超链接

2.超链接标签:

  <a href=’url地址‘ target=’页面打开的方式‘>页面元素(文字、图像、音频、视频)</a>

‘href’属性:值是要跳转的页面的地址,通常用’#’表示空链接

 ‘target’属性:新页面打开的方式,取值有’_self’和’_blank’

          ‘_self’:表示在原窗口打开页面,是’target’属性的默认值

          ‘_blank’:表示在新窗口中打开页面

<a href="http://www.baidu.com" target="_blank">百度一下</a>  <!-- 文字超链接 -->
<br><br>
<a href="002.html" target="_blank">进入首页</a>
<br><br>
<a href="http://www.hao123.com" target="_blank">
        <img src="../images/avatar.png">
</a>

3.通过超链接实现’锚点’:提高页面的检索速度

 第一步:在’锚点’位置给标签添加id属性

 第二步:在超链接位置中<a>标签的href属性值为’#id名’

4.给页面设置背景颜色、背景图像

(1)背景色:给body标签添加bgcolor属性

(2)背景图像:给body标签添加background属性

音频标签

<audio src=”../audio/西海情歌.mp3” controls=’controls’ autoplay=’autoplay‘>

‘controls’属性:表示的是标签带有控制按钮
‘autoplay’属性:表示是否可以进行自动播放
‘loop’属性:表示循环播放
          ‘src’属性:表示音频文件的地址
          ‘preload’属性:页面加载时音频也加载,并预备播放,若使用了’autoplay’属性则该属性被忽略

<audio src="../audio/西海情歌.mp3" controls='controls' preload="auto"></audio>

视频标签

<video src=”#” controls=’controls’ autoplay=’autoplay‘ poster=”../images/avatar.png“></video>

‘src’属性表示视频文件的url
‘controls’属性表示标签带有播放控制的按钮
‘autoplay’属性表示是否可以进行自动播放
‘poster’属性表示在视频文件下载时显示的图片
‘loop’属性表示循环播放
‘height’属性表示视频播放器的高度
‘width’属性表示播放器的宽度

<video src="#" controls='controls' autoplay='autoplay' poster="../images/avatar.png" width="500"></video>

内嵌框架标签

内嵌框架标签:将页面显示在指定的位置

<iframe src=”002.html” frameborder=”1″ name=”if” height=”600″ width=”400″></iframe>

<table border="1" width='500' height='600'>
        <tr>
            <td valign='top'> <!-- valign表示是单元格内容的垂直对齐方式,取值有三个:top、middle、bottom-->
                <a href="003.html" target="if">百度一下</a>
                <br><br>
                <a href="http://www.hao123.com" target="if">搜狐</a>
            </td>
            <td>
                <iframe src="002.html" frameborder="1" name="if" height="600" width="400"></iframe>
            </td>
        </tr>
</table>

《HTML中添加超链接、音频标签、视频标签、内嵌框架标签》

 

    原文作者:陛下,再来一杯娃哈哈
    原文地址: https://blog.csdn.net/m0_46420078/article/details/120648285
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞