<!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=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="index.css" />
</head>
<body>
<div class="content">
<div id="le1"><img src="图片素材/forumLogo.jpg" width="483" height="82" /></div>
<div id="le1"><img src="图片素材/6{]`SMPQ{VXDTZA5CI_6P9T.png" width="90" height="83" /></div>
<div id="a2"><img src="图片素材/forumLogo_r.jpg" width="387" height="82" /></div>
<ul class="ul">
<li class="li"><a href="#">首 页</a></li>
<li class="li"><a href="#">青鸟知识库</a></li>
<li class="li"><a href="#">青鸟论坛</a></li>
<li class="li"><a href="#">学员问答</a></li>
<li class="li"><a href="#">青鸟圈子</a></li>
<li class="li"><a href="#">实时课堂</a></li>
<li class="li"><a href="#">客户端下载</a></li>
<li class="li"><a href="#">帮助中心</a></li>
</ul>
<div id="c">
<div id="ce"><img src="图片素材/video.jpg" width="520" height="286" />
<ul>
<li>
<p class="a3">青鸟视频--携手共同进步</p>
<p class="a1">时长：80秒 <span class="a4"> 点击：541563</span></p>
</li>
</ul>
</div>
<div id="sm">
<h3>精彩视频</h3>
<ul id="le">
<li>
<div><a href="#"><img src="图片素材/video-01.jpg" width="130" height="79" /></a></div>
<p class="a3">携手共同进步</p>
<p class="a1">时长：80秒</p>
<p class="a2">点击：541563</p>
</li>
<li>
<div><a href="#"><img src="图片素材/video-03.jpg" width="130" height="79" /></a></div>
<p class="a3">努力的过程</p>
<p class="a1">时长：50秒</p>
<p class="a2">点击：912380</p>
</li>
</ul>
<ul id="le2">
<li>
<div><a href="#"><img src="图片素材/video-02.jpg" width="130" height="79" /></a></div>
<p class="a3">美丽的起点</p>
<p class="a1">时长：120秒</p>
<p class="a2">点击：657842</p>
</li>
<li>
<div><a href="#"><img src="图片素材/video-04.jpg" width="130" height="79" /></a></div>
<p class="a3">享受丰硕的成果</p>
<p class="a1">时长：60秒</p>
<p class="a2">点击：47651280</p>
</li>
</ul>
</div>
</div>
<div id="bottom">
<hr/>
<p>Copyright @ 1999-2014 Beijing Aptech Beida Jade Bird Information Technology Co.,Ltd <br/>
北大青鸟IT教育 北京阿博泰克北大青鸟信息技术有限公司 版权所有 </p>
</div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
* {
margin: 0px;
padding: 0px;
}
.content {
margin: 0px auto;
width: 960px;
}
ul {
list-style: none;
}
.ul {
clear: both;
width: 960px;
background-color: #383838;
overflow: hidden;
}
.li {
display:inline;
}
.li a{
float:left;
width:100px;
background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/forumMenuBg.gif);
background-repeat:no-repeat;
background-position:top right;
text-align:center;
font-size:15px;
line-height:30px;
font-weight:bold;
padding-left:2.5px;
color:#fff;
text-decoration:none;
}
.li a:hover{
background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/forumMenuBg.jpg);
background-repeat:repeat-x;
}
#le {
float: left;
padding-left:10px;
padding-right:8px;
padding-top:8px;
}
#le1{
float:left;}
#le2{
padding-top:8px;
float:right;
}
#c {
width: 960px;
overflow:hidden;
background-color:#ddd9d8;
}
#a2 {
float: right;
}
#ce {
background-color: #ddd9d8;
float: left;
padding:10px;
overflow:hidden;
}
#sm{
padding:10px;
margin-left:10px;
background-color:#cdd4dc;
float:right;
overflow:hidden;
}
.45{
font-size:13px;
font-weight:bold;
}
#ce img{
border-top: 20px #000 solid;
border-bottom: 20px #000 solid;
border-left: 50px #000 solid;
border-right: 50px #000 solid;
}
h3 {
color: #fff;
background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-03.jpg);
font-size: 15px;
line-height:30px;
font-weight: bold;
text-indent:1em;
}
li img{
border:solid 2px #fff;
}
p{
padding:5px;
font-size:12px;
}
#bottom{
background-color:#ddd9d8;
text-align:center;
font-size:12px;
line-height:30px;
clear:both;
}
.a1{
text-indent:1em;
padding-left:20px;
background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-01.jpg);
background-repeat:no-repeat;
background-position:8px 5px;
}
.a2{
text-indent:1em;
padding-left:20px;
background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-02.jpg);
background-repeat:no-repeat;
background-position:8px 5px;
}
.a3{
font-weight:bold;}
.a4{text-indent:2em;
padding-left:20px;
background-image:url(%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-02.jpg);
background-repeat:no-repeat;
background-position:8px 2px;
}
div a:hover img{
border:solid 2px yellow;}
网友评论