HTML第七章上机题3---------北大青鸟视频宣传

来源：互联网发布：网络监控app都有哪些编辑：程序博客网时间：2024/05/02 01:39
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>北大青鸟视频宣传片播放页</title><link href="css/video.css" rel="stylesheet" type="text/css" /></head><body><!--LOGO开始--><div id="topLogo"><img src="image/forumLogo_r.jpg"/></div><!--导航菜单开始--><div id="menu">  <ul>    <li><a href="#">首 页</a></li>    <li><a href="#">青鸟知识库</a></li>    <li><a href="#">青鸟论坛</a></li>    <li><a href="#">学员问答</a></li>    <li><a href="#">青鸟圈子</a></li>    <li><a href="#">实时课堂</a></li>    <li><a href="#">客户端下载</a></li>    <li><a href="#">帮助中心</a></li>  </ul></div><!--导航菜单结束--><div id="content"><div class="videoBody">      <div class="broadcastVideo"><img src="image/video.jpg"/></div>      <h1>青鸟视频——携手共同进步</h1>      <span>时长：80秒 </span>      <p>点击：541563</p>    </div><!--视频列表开始--><div class="videoSame">      <div class="videoTitle">精彩视频</div>      <ul class="videoSList">        <li><a href="#"><img src="image/video-01.jpg"/></a>          <h1>携手共同进步</h1>          <p>时长：80秒</p>          <span>点击：541563</span> </li>        <li><a href="#"><img src="image/video-02.jpg"/></a>          <h1>美丽的起点</h1>          <p>时长：120秒</p>          <span>点击：657842</span> </li>        <li><a href="#"><img src="image/video-03.jpg"/></a>          <h1>努力的过程</h1>          <p>时长：50秒</p>          <span>点击：912380</span> </li>        <li><a href="#"><img src="image/video-04.jpg"/></a> <h1>享受丰硕的成果</h1>          <p>时长：60秒</p>          <span>点击：47651280</span> </li>      </ul>    </div>    <div id="bottom">    Copyright @ 1999-2014 Beijing Aptech Beida Jade Bird Information Technology Co.,Ltd <br/>      北大青鸟IT教育      北京阿博泰克北大青鸟信息技术有限公司 版权所有  </div></div></body></html>@charset "gb2312";/* CSS Document */body, div, dl, dt, dd, ul, li, p, h1, h2, h3 {margin:0px;padding:0px;}body {line-height:20px;font-size:12px;}img {border:0px;}ul, li {list-style:none;}#topLogo {width:960px;margin:0px auto;color:#a3a3a3;background:#ebebeb url(../image/forumLogo.jpg) 0px 0px no-repeat;height:82px;text-align:right;}#menu {background-color:#383838;height:33px;width:960px;margin:0px auto;}#menu li {float:left;}#menu li a, #menu li a:hover {color:#ffffff;text-decoration:none;font-size:14px;font-weight:bold;height:33px;line-height:33px;display:block;padding:0px 15px;}#menu li a {background:url(../image/forumMenuBg.gif) top right no-repeat;}#menu li a:hover {background:url(../image/forumMenuBg.jpg) repeat-x;}#content {margin:0px auto;width:960px;padding:10px 0px 10px 0px;background:#ddd9d9;height:420px;}.videoBody {float:left;width:620px;padding:0px 0px 0px 20px;}.broadcastVideo {height:306px;padding-top:20px;background-color:#000000;text-align:center;}.videoBody h1 {font-size:12px;padding-left:10px;}.videoBody span {background:url(../image/icon-01.jpg) 10px 5px no-repeat;padding-left:30px;display:block;float:left;line-height:25px;}.videoBody p {background:url(../image/icon-02.jpg) 10px 5px no-repeat;padding-left:30px;line-height:25px;float:left;}.videoSame {float:right;width:295px;height:370px;background-color:#ced4db;}.videoTitle {background:url(../image/icon-03.jpg) repeat-x;height:29px;line-height:29px;color:#ffffff;font-size:14px;font-weight:bold;padding-left:15px;}.videoSList {padding:10px 0px 0px 10px;}.videoSList li {float:left;width:142px;height:160px;}.videoSList li a img {border:2px #ffffff solid;}.videoSList li a:hover img {border:2px #f08609 solid;}.videoSList h1 {font-size:12px;padding-left:10px;line-height:25px;}.videoSList p {background:url(../image/icon-01.jpg) 10px 5px no-repeat;padding-left:30px;height:25px;line-height:25px;}.videoSList span {background:url(../image/icon-02.jpg) 10px 5px no-repeat;padding-left:30px;height:25px;line-height:25px;display:block;}#bottom {border-top:1px #666 solid;line-height:25px;text-align:center;clear:both;}
0 0