搜索
第二章页面版式控制和添加多媒体课程回顾1.HTML的地位和作用2.开发HTML使用的工具3.http协议4.HTML文件的结构5.如何设置HTML文件的背景色及文本色6.如何在页面上添加一个超链接7.HTML页面的文字布局8.HTML页面的各种字体效果及滚动字符本章内容•页面版式控制标记•在HTML页中插入图像•设置图像热点•插入背景音乐•插入多媒体文件页面版式控制标记描述!--注解--注释标记p分段标记br/换行标记center居中标记hr/水平线标记pre预排版标记div层定位标记注释标记功能：为文中不同的部分加上说明，方便日后修改用作版权声明!--注释内容--开始标记结束标记注释说明注意:注释标记中没有任何属性。开始标记和结束标记必须同时存在。注解内容允许为空。其内容长度不用被限制在一行内，可以为任意长度。结束标识和开始标识可以不在一行上。分段标记•功能：实现类似于文档中的段落效果•p也可以有多种属性，比较常用的属性是：align＝#•还有style属性，在后面学习样式的时候会详细介绍注意：HTML不识别键盘的回车换行HTML将多个空格以及回车等效为一个空格，HTML的分段完全依赖于分段标记分段实例查看源码换行标记br•br/标记用来创建一个回车换行•如果br/标记处在p/p标记对外面，将创建一个大的回车换行•若处在p/p标记对之间，br/标记前面和后面文本的行与行之间的距离将比较小注意：br标记只有开始标记，没有结束标记换行标记实例查看源码水平线标记注意：水平线标记hr/是单标记align=#设定线条摆放位置size=#属性width=#属性设定线条长度color=#属性left；right；center以像素作单位内定为2以像素作单位，可以是绝对或相对值，内定为100%设定线条颜色，内定为黑色属性hr/示例hrwidth=400size=10align=centernoshade/居中标记查看源码比较上面页面上下两段诗词位置有什么不同center标记是内容处于居中位置预排版标记比较上面页面上下两段内容格式有什么不同HTML是不识别空格和回车的如何实现左侧效果？pre/pre查看源码定位标记div定位标记多用于在制定分块显示内容比较重要的属性是style后续章节连同样式表加深理解两个div查看源码嵌入图像•网页之所以被人喜爱，因为上面有五花八门的东西•包括有图像，视频，音乐等等•网页上支持的图片格式：–BMP–GIF–JPEG–PNG•格式IMGSRC=“图形文件地址“/我就喜欢看网页上的图片在网页中插入图像如图所示：页面中插入了图片使用imgsrc=“url”/src可以是本机或者远程主机上的图形查看源码设置图像如图显示的小狗更加美观通过设置不同的属性达到这样的效果鼠标移动到图片上还有提示查看源码注意：图片最好按照原图尺寸或者比例显示alt=属性如图所示：该属性用于显示提示话语！若浏览器不支持图片，则在图片位置会显示该文字！查看源码图文混排文字和图片还可以有不同的排版方式:如left、right具体效果请参考源码图片链接链接和图片的组合构成图片链接AHREF=资源地址IMGSRC=“URL/A查看源码热点如图显示红框显示的位置是我校所在的赛格商务楼鼠标点击该区域会链接到我校的网站map和area查看源码多媒体效果没有了视频、音乐我们的网页岂不如同报纸。。。背景音乐多媒体bgsound标记是用来插入背景音乐。bgsoundsrc=042.mp3autostart=“true”loop=“infinite”/插入背景音乐只适用于IE浏览器音乐文件的位置是否在音乐档下载完之后自动播放。true是，false否(默认值)LOOP=2表示重复两次，Infinite表示重复多次插入多媒体src=#autostart=#loop=#hidden=#starttime=分:秒volume=0-100width=整数和high=整数属性embed是用来插入各种多媒体格式可以是Midi、Wav、AIFF、AU等等src=#Bodydivalign=centerembedsrc=file.wmv/div/Body属性用来设定多媒体档案及路径，可以是相对或绝对查看源码autostart=#Bodydivalign=centerembedsrc=file.wmvautostart=true/div/Bodyautostart=#属性设定是否在音乐档下载完之后就自动播放true是，false否(默认值)loop=#Bodydivalign=centerembedsrc=file.wmvautostart=trueloop=true/div/Body用来设定播放次数loop=2表示重复两次loop=true表示持续反复播放loop=false表示只播放一次hidden=#Bodydivalign=centerembedsrc=file.wmvautostart=trueloop=truehidden=true/div/Body是否完全隐藏控制画面true为是，no为否(默认)starttime=分:秒Bodydivalign=centerembedsrc=file.wmvautostart=trueloop=truestarttime=00:30/div/Body设定多媒体从网页打开30秒后开始播放设定多媒体开始播放的时间volume=0-100Bodydivalign=centerembedsrc=file.wmvautostart=trueloop=truevolume=50/div/Body设定音量的大小，数值是0到100之间。内定则为使用系统本身的设定调整视频尺寸Bodydivalign=centerembedsrc=file.wmvautostart=trueloop=truewidth=400high=200/div/Body设定控制面板的高度和宽度用img插入视频bodycenterpalign=centerimgdynsrc=file.wmv/p/center/body格式：imgdynsrc=avi文件地址img有关视频属性以下是img用于播放视频可能用到的属性总结•用pdivcenterhrbr等标签可以用于HTML页面排版•用img标签可以在页面中插入图像或视频•图片在网页中可以被做成按钮或者是热点地图•用embed标签可以在页面中插入视频作业•根据本章所学的知识点，完成一个内容丰富的网页–要求：1、页面要有图文混排的效果2、尝试使用不同的排版标记3、点击图片可以跳转到其他页面4、在右下角放置一个div，显示一段视频