真是低调le 发表于 2021-9-14 22:12:20

010 HTML标签图文详解(三)

多媒体标签

声明:
多媒体包含:音频、视频、Flash。网页上的多媒体基本都是Flash格式的。
.wmv、.dat、.mob、.rmvb等视频格式,在网页上不能直接播放,需要安装第三方的插件,才可以播放。不同的浏览器,播客上述视频格式,所使用插件参数又不一样。
上述格式视频一般文件较大,不利于网络下载播放。
一般情况下,是将其它的视频格式,转成Flash来在网页上播放。转换软件:格式工厂等。
Flash格式的视频兼容性非常好,Flash格式的文件很小。

<bgsound>标签:播放背景音乐
属性:
 - src="音乐文件的路径"
 - loop="-1":属性值代表播放次数,-1代表循环播放。

举例:

 <body>
    <bgsound src="王菲 - 清风徐来.mp3"></bgsound>
 </body>

运行效果:
打开网页后,在IE 8中播放正常,播放时网页上显示一片空白。在google浏览器中无法播放。

<embed>标签:播放多媒体文件(音频、视频等)

主要应用Netscape浏览器,它不是W3C规范。

 > 备注:视频格式可以支持 mp4、wav等,但不是所有视频格式都支持。

属性:
 - src="多媒体文件的路径"
 - loop="-1":属性值代表播放次数,-1代表循环播放。
 - autostart="false":打开网页时,禁止自动播放。默认值是true。
 - volume="100":设置默认的音量大小,测试发现这个值好像不起作用哦。
 - width:指Flash文件的宽度
 - height:指Flash文件的高度
 - quality:指Flash的播放质量,质量有高有低 hight  low
 - pluginspage:如果指定的Flash插件不存在,则从pluginspage指定的地方进行下载。
 - type:指定Flash的文件格式类型
 - wmode:指Flash的背景是否可以透明,取值:transparent是透明的

<embed>标签播放音频举例:

 <body>
    <embed src="王菲 - 清风徐来.mp3"></embed>
 </body>


IE 8中的运行效果:

http://img.smyhvae.com/2015-10-02-cnblogs_html_37.png

google浏览器中的运行效果:

http://img.smyhvae.com/2015-10-02-cnblogs_html_38.png

注:在HTML5中新增了<video>标签播放视频。


<object>标签:播放多媒体文件(音频、视频等)

主要应用IE浏览器,它是W3C规范。

属性:
 - classid:指定Flash插件的ID号,一般存在于注册表中。
 - codebase:如果Flash插件不存在,则从codebase指定的地址下载。
 - <param>标签的主要作用:设置具体的详细参数。

总结:在网页中插入Flash时,为了同时兼容多种浏览器,需要将<object>标签和<embed>标签标记一起使用,但使用的顺序是:<object>中嵌套<embed>标记。

举例:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="778" height="202">
  <param name="movie" value="images/banner.swf">
  <param name="quality" value="high">
  <param name="wmode" value="transparent">
  <embed src="images/banner.swf" width="778" height="202" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object>

<marquee>:滚动字幕标签

如果在这个标签里设置了内容,那么,打开网页时,内容会像弹幕一样自动移动。
属性:
 - direction="right":移动的目标方向。属性值可以是:left(从右向左移动,默认值)、right(从左向右移动)、up(从下向上移动)、down(从上向下移动)。

 - behavior="slide":行为方式。属性值可以是:slide(只移动一次)、scroll(循环移动,默认值)、alternate(循环移动)、。
alternate和scroll属性值都是循环移动,区别在于:假设在direction="right"的情况下,behavior="scroll"表示从左到右、从左到右、从左到右···behavior="alternate"表示从左到右、从右到左、从左到右···

 - scrollamount="30":移动的速度
 - loop="3": 循环多少圈。负值表示无限循环
 - scrolldelay="1000":移动一次休息多长时间。单位是毫秒。

举例:

<marquee behavior="alternate" direction="down"  width="300" height="200" bgcolor="#8c5dc1">我来了</marquee>

效果:

ttp://img.smyhvae.com/2015-10-02-cnblogs_html_04.gif

html废弃标签介绍

HTML现在只负责语义,而不负责样式。但是HTML一开始,连样式也包办了。这些样式的标签,都已经被废弃。

2004年之前的东西:

<font size="9" color="red">哈哈</font>

下面这些标签都是css钩子,而不是原意:

    <b>加粗</b>
    <u>下划线</u>
    <i>倾斜</i>
    <del>删除线</del>
    <em>强调</em>
    <strong>强调</strong>

这些标签,是有着浓厚的样式的作用,干涉了css的作用,所以HTML抛弃了他们。

类似的还有水平线标签:

<hr />


换行标签:

<br />

但是,网页中99.9999%需要换行的时候,是因为另起了一个段落,所以要用p,而不要用<br />。不到万不得已,不要用br标签。

标准的div+css页面,只会用到种类很少的标签:

div  p  h1  span   a   img   ul   ol    dl    input

知道每个标签的特殊用法、属性。比如a标签,img的属性。
页: [1]
查看完整版本: 010 HTML标签图文详解(三)