您的位置：首页 > 其它

第七章上机练习2 视频宣传片 有瑕疵

2016-10-19 15:04 323 查看 
<!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>
<style type="text/css">
.div1{background-color: #999;
height: 608px;
width: 410px;

}
.div2{

float:left;
height: 300px;
width: 198px;
background-color: #999;
}

h1 {
background-image: url(icon-03.jpg);
color: #FFF;
background-repeat: repeat-x;
}
.aaa{
background-image: url(%E6%96%87%E4%BB%B6%E6%8E%A5%E6%94%B6%E6%9F%9C/03%20%E6%8F%90%E4%BE%9B%E7%BB%99%E5%AD%A6%E5%91%98%E7%9A%84%E4%B8%8A%E6%9C%BA%E7%BB%83%E4%B9%A0%E7%B4%A0%E6%9D%90/%E7%BB%83%E4%B9%A02%EF%BC%9A%E5%8C%97%E5%A4%A7%E9%9D%92%E9%B8%9F%E8%A7%86%E9%A2%91%E5%AE%A3%E4%BC%A0%E7%89%87%E5%88%97%E8%A1%A8/%E5%9B%BE%E7%89%87%E7%B4%A0%E6%9D%90/icon-01.jpg);
background-repeat: no-repeat;
text-indent: 1em;
}
span{
display:block;
background-image: url(icon-02.jpg);
background-repeat: no-repeat;
text-indent: 1em;
}
li{list-style-type: none;}
</style>
</head>

<body>
<div class="div1">
<h1>精彩视频</h1>

<div class="div2"><ul>
<li><a href="#"><img src="video-01.jpg" /></a>
<h2>携手共进</h2>
<p class="aaa">时长:80秒</p>
<span>点击:541563</span>
</li>
</ul>
</div>
<div class="div2"><ul><li><a href="#"><img src="video-02.jpg" /></a>
<h2>美丽的起点</h2>
<p class="aaa">时长:120秒</p>
<span>点击:685423</span></li>
</ul>
</div>
<div class="div2"><ul><li><a href="#"><img src="video-03.jpg" /></a>
<h2>努力的过程</h2>
<p class="aaa">时长:50秒</p>
<span>点击:921423</span></li>
</ul></div>
<div class="div2"><ul><li><a href="#"><img src="video-04.jpg" /></a>
<h2>享受丰硕的成果</h2>
<p class="aaa">时长:60秒</p>
<span>点击:921423</span></li>
</ul></div>
</div>

</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航