html课件及素材实践部分八章.pdfVIP

任务一：页面布局

◼使用DIV+CSS实现浏览器的页面布局

标题

商品展示区，

显示图像大小

350*500

商品图像导航区，

小图像大小为

100*150

页面布局

/*标题栏样式*/

#goosh1{

divid=goods

text-align:center;

!--标题--

◼font-family:微软雅黑;

按照需求完成页面布局的编码

h1手机图片展示/h1

color8080;

!--大展示区--

divid=show

/*商品展示框样式*/

ul

#show{

li/li

margin:0pxauto;

…

…

width:350px;

/ul

height:500px;

/div

border:3pxsolid#ccc;

!--图片导航区--

overidden;

}diviv_box

lid=nav

/*导航栏*/

li/li

#nav_box{

…...

border:1pxsolid#808080;

/ul

height:150px;

/div

}

/div

任务二：添加并实现浏览

◼添加并实

◼基于任务1中

栏中的小图像

添加并实现浏览

◼按照需求添加，并实现的浏览功能

谢谢

End