📒 web网页设计期末课程大作业:仿360影视首页(1页)
大学生个人网页设计 HTML个人网页制作 web个人网站模板 简单静态HTML个人网页作品
该首页代码采用了DIV盒子的布局方法，展示了盒子嵌套、浮动、边距、边框和背景等属性的运用。外部大盒子实现居中，内部布局为左右中结构，底部则是横向浮动排列。代码中涵盖了大学前端学习的知识点和布局技巧，CSS代码量丰富且细致，通过hover效果实现过渡和鼠标滑过效果。此外，页面中使用表格和表单来补充功能，方便新手学习。某些源码页面未使用JS，需者可自行添加。
涵盖个人、电影、美食、动漫、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、明星、服装、体育、化妆品、物流、环保、书籍、婚纱、军事、游戏、节日、戒烟、摄影、文化、家乡、鲜花、礼品、汽车等多个网页设计主题，能够满足大学生在网页大作业中的需求！
页面结构： 分为页头、菜单导航栏（最好支持下拉）、主要内容区域和页脚四大部分。
页面链接： 所有页面应互相超链接，支持三级页面，整体结构为5-10个页面。
样式统一： 页面样式需统一且布局正常，使用Div+CSS技术确保无错乱。
美观的菜单： 菜单设计应美观且醒目，二级菜单可正常弹出和跳转。
JS特效： 需要有如定时和手动切换的图片轮播等JS特效。
多媒体元素： 页面中应包含多媒体元素，如GIF、视频和音乐，并运用表单技术。
清爽美观： 页面设计应清新、优雅，避免雷同。
整体上，不仅要能展示用户需求的内容，还需确保良好的布局、优雅的界面、恰当的配色以及多样的表现形式。
目录导航
一、📖 作品介绍
网页作品简介： 该设计达到了HTML网页设计A++水平，部分支持手机和PC的响应式布局。
网页作品编辑： 此作品为学生网页设计类型，代码采用简单的学生水平的HTML+CSS布局制作。下载后可使用任何HTML编辑软件（如：DW、HBuilderX、Vscode、Sublime Text、Webstorm、Notepad++等）进行编辑和修改。
网页作品布局： 整体采用响应式布局，包含LOGO、导航、主体内容等布局。子页面有多种布局方式，兴趣爱好内容使用图片列表展示，成绩页面插入了表格，联系我们页面则使用了左对齐的图片布局。
网页作品技术： 使用DIV+CSS制作网页，包含背景图、音乐、视频、Flash、滚动文字、CSS特效、鼠标悬停效果、导航变色、表单提交及评论留言功能，并通过JavaScript进行表单验证（确保提交时表单不能为空）。
提示：以下是本篇文章正文内容，下面案例可供参考
二、🌐 效果演示
三、🪓 代码实现
🧱 HTML结构代码
代码如下（示例）：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link rel="stylesheet" href="css/base.css" />
<link rel="stylesheet" href="css/style.css" />
<script>
function Add(add, ponit) {
var oAddBox = document.getElementById(add);
var aAddUl = oAddBox.getElementsByTagName('ul');
var oAddBtn = document.getElementById(ponit);
var aAddBtn = oAddBtn.getElementsByTagName('i');
for (var i = 0; i < aAddBtn.length; i++) {
aAddBtn[i].index = i
aAddBtn[i].onmouseover = function() {
for (var i = 0; i < aAddBtn.length; i++) {
aAddBtn[i].className = '';
aAddUl[i].style.display = 'none';
}
this.className = 'active';
aAddUl[this.index].style.display = 'block';
};
}
}
function Dby(aBy) {
var oDby = document.getElementById(aBy);
var aDby = oDby.getElementsByTagName('li');
for (var i = 0; i < aDby.length; i++) {
aDby[i].onmouseover = function() {
for (var i = 0; i < aDby.length; i++) {
aDby[i].className = '';
}
this.className = 'active';
};
}
}
function xxk(dlbox, btn) {
var oTurnz = document.getElementById(dlbox);
var aTurnz = oTurnz.getElementsByTagName('dd');
var oZbtn = document.getElementById(btn);
var aZbtn = oZbtn.getElementsByTagName('li');
for (var i = 0; i < aZbtn.length; i++) {
aZbtn[i].index = i
aZbtn[i].onmouseover = function() {
for (var i = 0; i < aZbtn.length; i++) {
aZbtn[i].className = '';
aTurnz[i].style.display = 'none';
}
this.className = 'active1';
aTurnz[this.index].style.display = 'block';
};
}
}
window.onload = function() {
var oHdText = document.getElementById('hd_text');
var oInpList = document.getElementById('inplist');
oHdText.onclick = function() {
if (oInpList.style.display == 'block') {
oInpList.style.display = 'none'
} else {
oInpList.style.display = 'block'
}
};
var oHdul = document.getElementById('hdul');
var aHdulLi = oHdul.getElementsByTagName('li');
for (var i = 0; i < aHdulLi.length; i++) {
aHdulLi[i].onmouseover = function() {
for (var i = 0; i < aHdulLi.length; i++) {
aHdulLi[i].className = '';
}
this.className = 'turn';
};
}
for (var i = 0; i < aHdulLi.length; i++) {
aHdulLi[i].onmouseout = function() {
this.className = '';
};
}
var oHdNavBox = document.getElementById('hd_navbox');
var aTurnColorLi = oHdNavBox.getElementsByTagName('li');
for (var i = 0; i < aTurnColorLi.length; i++) {
aTurnColorLi[i].onmouseover = function() {
for (var i = 0; i < aTurnColorLi.length; i++) {
aTurnColorLi[i].className = '';
}
this.className = 'navactive';
};
}
for (var i = 0; i < aTurnColorLi.length; i++) {
aTurnColorLi[i].onmouseout = function() {
for (var i = 0; i < aTurnColorLi.length; i++) {
aTurnColorLi[i].className = '';
}
};
}
var oSmall = document.getElementById('SmallPic');
var aSmall = oSmall.getElementsByTagName('li');
var oBig = document.getElementById('BigPic');
var aBig = oBig.getElementsByTagName('li');
for (var i = 0; i < aSmall.length; i++) {
aSmall[i].index = i;
aSmall[i].onmouseover = function() {
for (var i = 0; i < aSmall.length; i++) {
aSmall[i].className = '';
aBig[i].style.display = 'none';
}
this.className = 'LbLi';
aBig[this.index].style.display = 'block';
};
}
var oWuxiubo = document.getElementById('wuxiubo');
var aWuxiubo = oWuxiubo.getElementsByTagName('li');
for (var i = 0; i < aWuxiubo.length; i++) {
aWuxiubo[i].onmouseover = function() {
for (var i = 0; i < aWuxiubo.length; i++) {
aWuxiubo[i].className = '';
}
this.className = 'activeshow';
};
}
for (var i = 0; i < aWuxiubo.length; i++) {
aWuxiubo[i].onmouseout = function() {
this.className = '';
};
}
var oXu = document.getElementById('girl');
var aGirl = oXu.getElementsByTagName('li');
for (var i = 0; i < aGirl.length; i++) {
aGirl[i].onmouseover = function() {
for (var i = 0; i < aGirl.length; i++) {
aGirl[i].className = '';
}
this.className = 'activeshow';
};
}
for (var i = 0; i < aGirl.length; i++) {
aGirl[i].onmouseout = function() {
this.className = '';
};
}
var oTurnBox1 = document.getElementById('turn1');
var aTurnLi1 = oTurnBox1.getElementsByTagName('li');
for (var i = 0; i < aTurnLi1.length; i++) {
aTurnLi1[i].onmouseover = function() {
for (var i = 0; i < aTurnLi1.length; i++) {
aTurnLi1[i].className = '';
}
this.className = 'turnshow';
};
}
var oRight = document.getElementById('i2');
var oLeft = document.getElementById('i1');
var oUl2 = document.getElementById('ul2');
var oUl1 = document.getElementById('ul1');
oRight.onclick = function() {
oUl2.style.display = 'block';
oUl1.style.display = 'none';
};
oLeft.onclick = function() {
oUl1.style.display = 'block';
oUl2.style.display = 'none';
};
var oBtn = document.getElementById('btn');
var aBtn = oBtn.getElementsByTagName('li');
var oShow = document.getElementById('show');
var aShow = oShow.getElementsByTagName('ul');
var aShowLi = oShow.getElementsByTagName('li');
for (var i = 0; i < aBtn.length; i++) {
aBtn[i].index = i
aBtn[i].onmouseover = function() {
for (var i = 0; i < aBtn.length; i++) {
aBtn[i].className = '';
aShow[i].style.display = 'none';
}
this.className = 'active';
aShow[this.index].style.display = 'block';
};
}
for (var i = 0; i < aShowLi.length; i++) {
aShowLi[i].onmouseover = function() {
this.className = 'active';
};
}
for (var i = 0; i < aShowLi.length; i++) {
aShowLi[i].onmouseout = function() {
this.className = '';
};
}
var oDsj = document.getElementById('dsj');
var aDsj = oDsj.getElementsByTagName('li');
for (var i = 0; i < aDsj.length; i++) {
aDsj[i].onmouseover = function() {
for (var i = 0; i < aDsj.length; i++) {
aDsj[i].className = '';
}
this.className = 'active';
};
}
var oBtn1 = document.getElementById('btn1');
var aBtn1 = oBtn1.getElementsByTagName('li');
var oShow1 = document.getElementById('show1');
var aShow1 = oShow1.getElementsByTagName('ul');
var aShowLi1 = oShow1.getElementsByTagName('li');
for (var i = 0; i < aBtn1.length; i++) {
aBtn1[i].index = i
aBtn1[i].onmouseover = function() {
for (var i = 0; i < aBtn1.length; i++) {
aBtn1[i].className = '';
aShow1[i].style.display = 'none';
}
this.className = 'active';
aShow1[this.index].style.display = 'block';
};
}
for (var i = 0; i < aShowLi1.length; i++) {
aShowLi1[i].onmouseover = function() {
this.className = 'active';
};
}
for (var i = 0; i < aShowLi1.length; i++) {
aShowLi1[i].onmouseout = function() {
this.className = '';
};
}
var oDsj1 = document.getElementById('dsj1');
var aDsj1 = oDsj1.getElementsByTagName('li');
for (var i = 0; i < aDsj1.length; i++) {
aDsj1[i].onmouseover = function() {
for (var i = 0; i < aDsj1.length; i++) {
aDsj1[i].className = '';
}
this.className = 'active';
};
}
var oDateul = document.getElementById('datebtn');
var aDatebtn = oDateul.getElementsByTagName('li');
var oDatebd = document.getElementById('datebd');
var aDatebd = oDatebd.getElementsByTagName('textarea');
for (var i = 0; i < aDatebtn.length; i++) {
aDatebtn[i].index = i;
aDatebtn[i].onmouseover = function() {
for (var i = 0; i < aDatebtn.length; i++) {
aDatebtn[i].className = '';
aDatebd[i].style.display = 'none';
}
this.className = 'active';
aDatebd[this.index].style.display = 'block';
};
}
var oOnlyul = document.getElementById('onlyul');
var aLiOnlyLi = oOnlyul.getElementsByTagName('li');
var oOnlybdbox = document.getElementById('onlybdbox');
var aOnlybdbox = oOnlybdbox.getElementsByClassName('onlybd');
for (var i = 0; i < aLiOnlyLi.length; i++) {
aLiOnlyLi[i].index = i;
aLiOnlyLi[i].onmouseover = function() {
for (var i = 0; i < aLiOnlyLi.length; i++) {
aLiOnlyLi[i].className = '';
aOnlybdbox[i].style.display = 'none';
}
this.className = 'active';
aOnlybdbox[this.index].style.display = 'block';
};
}
Add('add1', 'point1');
Add('add2', 'point2');
Add('add3', 'point3');
Add('add4', 'point4');
Dby('dby')
xxk('trunz', 'zbtn')
xxk('trunz1', 'zbtn1')
};
</script>
</head>
<body>
<div class="hdbox">
<div class="hd_main clearfix">
<h1>
<a class="logo" href="javascript:;">360影视</a>
</h1>
<div class="hd_inp clearfix">
<input id="hd_text" class="hd_text" type="text" placeholder="你怎么可以这么懒" value="" />
<input class="hd_button" type="button" value="" />
<div id="inplist" class="inplist"><img src="img/toulan1.jpg" /></div>
</div>
<ul class="hdul clearfix fl" id="hdul">
<li><a href="javascript:;"><span class="bg1"></span>我的影视</a></li>
<li>
<a href="javascript:;">观看记录
<span class="bg2"></span>
<div class="seelist"><i></i>暂无观看记录</div>
</a>
</li>
<li><a href="javascript:;"><span class="bg3"></span>APP下载</a></li>
</ul>
</div>
</div>
<div style="background:javascript:;fff;height:42px;">
<div class="hd_navbox clearfix" id="hd_navbox">
<ul class="navleft clearfix fl">
<li><a style="color:javascript:;fd8d4e;" href="javascript:;">首页</a></li>
<li><a class="tc" href="javascript:;">网络院线</a></li>
<li>
<a class="tc" href="javascript:;">电视剧</a>
<div class="playlist">
<b class="nav_d"></b>
<ul class="nav_s1">
<li><a href="javascript:;">电视剧首页</a><i></i></li>
<li><a href="javascript:;">内地</a></li>
<li><a href="javascript:;">美剧</a></li>
<li><a href="javascript:;">韩剧</a></li>
<li><a href="javascript:;">TVB</a></li>
<li><a href="javascript:;">台剧</a></li>
<li><a href="javascript:;">泰剧</a></li>
</ul>
</div>
</li>
<li style="padding-right:0;">
<a class="tc" href="javascript:;">电影</a>
<div class="movielist">
<b class="nav_d"></b>
<ul class="nav_s1">
<li><a href="javascript:;">电影首页</a><i></i></li>
<li><a href="javascript:;">电影馆</a></li>
<li><a href="javascript:;">付费电影</a></li>
<li><a href="javascript:;">微电影</a></li>
<li><a href="javascript:;">排行榜</a></li>
<li><a href="javascript:;">台剧</a></li>
</ul>
</div>
</li>
<li style="padding-left:0;"><a class="tc" href="javascript:;"><i class="nav_2"></i>预告</a></li>
<li><a class="tc" href="javascript:;">综艺</a></li>
<li><a class="tc" href="javascript:;">动漫</a></li>
<li><a class="tc" href="javascript:;">资讯</a></li>
<li><a class="tc" href="javascript:;">娱乐</a></li>
<li><a class="tc" href="javascript:;">直播</a></li>
<li><a class="tc" href="javascript:;">广场舞</a></li>
</ul>
<ul class="navright clearfix fr">
<li><a class="tc" href="javascript:;">秀场</a></li>
<li><a class="tc" href="javascript:;">娱乐</a></li>
<li><a class="tc" href="javascript:;">搞笑</a></li>
<li><a class="tc" href="javascript:;">音乐</a></li>
<li><a class="tc" href="javascript:;">游戏</a></li>
<li><a class="tc" href="javascript:;">专题</a></li>
</ul>
</div>
</div>
<div class="hd_box">
<ul class="BigPic" id="BigPic">
<li style="display:block;">
<a href="javascript:;">
<img src="img/pic5.jpg" width="1350" height="450" />
<h3>中国好声音</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic0.jpg" width="1350" height="450"/>
<h3>《爸爸去哪儿》</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic1.jpg" width="1350" height="450"/>
<h3>万物生灵</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic2.jpg" width="1350" height="450"/>
<h3>快乐大本营</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic3.jpg" width="1350" height="450"/>
<h3>横冲直撞</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic4.jpg" width="1350" height="450"/>
<h3>佛本是道</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic6.jpg" width="1350" height="450"/>
<h3>《爸爸还去哪儿》</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic7.jpg" width="1350" height="450"/>
<h3>冰与火的春天</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic8.jpg" width="1350" height="450"/>
<h3>澳门风云</h3>
<p>网报：中国好声音八成以上收视率来自周董</p>
</a>
</li>
</ul>
<ul class="SmallPic clearfix" id="SmallPic">
<li class="LbLi">
<a href="javascript:;">
<img src="img/pic_05.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_0.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_01.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_02.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_03.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_04.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_06.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_07.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
<li>
<a href="javascript:;">
<img src="img/pic_08.jpg" width="120" alt=""/>
<div class="opabox"></div>
<div class="borderbox"></div>
</a>
</li>
</ul>
</div>
<div class="hot">
<div class="hothd clearfix">
<h2>今日热门</h2>
<a href="javascript:;">更多>></a>
<h4>热门精选</h4>
</div>
<div class="hothdbd clearfix">
<div class="hotbdleft fl">
<div class="lefttop">
<div class="lefttopleft fl" title="英雄联盟S5预选赛"><a href="javascript:;">
<img src="img/todyhot1.jpg" alt=""/>
<div class="missopa1">英雄联盟S5预选赛</div>
<div class="missopa"></div>
<p class="miss"><a href="javascript:;">中路miss，各位提好裤子！</p></a>
</a>
</div>
<div class="lefttopright fl">
<ul class="wuxiubo clearfix" id="wuxiubo">
<li title="吴秀波完美大叔控">
<a href="javascript:;">
<img src="img/180 110.jpg" alt=""/>
<div class="opatxt">你丫的看我作甚！</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">吴秀波完美大叔控</p></a>
</a>
</li>
<li title="吴秀波完美大叔控">
<a href="javascript:;">
<img src="img/180 110.jpg" alt=""/>
<div class="opatxt">你丫的看我作甚！</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">吴秀波完美大叔控</p></a>
</a>
</li>
<li title="吴秀波完美大叔控">
<a href="javascript:;">
<img src="img/180 110.jpg" alt=""/>
<div class="opatxt">你丫的看我作甚！</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">吴秀波完美大叔控</p></a>
</a>
</li>
<li title="吴秀波完美大叔控">
<a href="javascript:;">
<img src="img/180 110.jpg" alt=""/>
<div class="opatxt">你丫的看我作甚！</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">吴秀波完美大叔控</p></a>
</a>
</li>
<li title="吴秀波完美大叔控">
<a href="javascript:;">
<img src="img/180 110.jpg" alt=""/>
<div class="opatxt">你丫的看我作甚！</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">吴秀波完美大叔控</p></a>
</a>
</li>
<li title="吴秀波完美大叔控">
<a href="javascript:;">
<img src="img/180 110.jpg" alt=""/>
<div class="opatxt">你丫的看我作甚！</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">吴秀波完美大叔控</p></a>
</a>
</li>
</ul>
<div class="jiangcai"></div>
</div>
</div>
<div class="leftbottom">
<ul class="girl clearfix" id="girl">
<li title="港囧">
<a href="javascript:;">
<img src="img/1801001.jpg" alt=""/>
<div class="opatxt1">徐峥新品</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">徐峥新品《港囧》邀你来high</p></a>
</a>
</li>
<li title="港囧">
<a href="javascript:;">
<img src="img/1801001.jpg" alt=""/>
<div class="opatxt1">徐峥新品</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">徐峥新品《港囧》邀你来high</p></a>
</a>
</li>
<li title="港囧">
<a href="javascript:;">
<img src="img/1801001.jpg" alt=""/>
<div class="opatxt1">徐峥新品</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">徐峥新品《港囧》邀你来high</p></a>
</a>
</li>
<li title="港囧">
<a href="javascript:;">
<img src="img/1801001.jpg" alt=""/>
<div class="opatxt1">徐峥新品</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">徐峥新品《港囧》邀你来high</p></a>
</a>
</li>
<li title="港囧">
<a href="javascript:;">
<img src="img/1801001.jpg" alt=""/>
<div class="opatxt1">徐峥新品</div>
<div class="shadow"></div>
<p class="txt"><a href="javascript:;">徐峥新品《港囧》邀你来high</p></a>
</a>
</li>
</ul>
</div>
</div>
<div class="hotbdright fr">
<div class="right1" title="花千骨">
<img src="img/240120.jpg" alt="" />
<div class="huaopa">花花小骨</div>
</div>
<div class="right2 clearfix" title="阵容 阿汤哥小黄人pk囧途兄弟">
<a href="javascript:;">
<img src="img/110601.jpg" alt=""/>
<p>进口大片对决华语最强阵容 阿汤哥小黄人pk囧途兄弟</p>
</a>
</div>
<div class="right2 clearfix" title="纪念反法西斯战争胜利70周年影视展播">
<a href="javascript:;">
<img src="img/110602.jpg" alt=""/>
<p>纪念反法西斯战争胜利70周年影视展播</p>
</a>
</div>
<div class="right4" title="徐峥赵薇上演床戏 “霸气”赵薇硬上弓">
<img src="img/xuzheng.jpg" width="240" height="160" alt="" />
<div class="xuzheng">徐峥赵薇上演床戏 “霸气”赵薇硬上弓</div>
</div>
</div>
</div>
</div>
<div class="net">
<div class="nethd clearfix">
<h2>360网络院线</h2>
<a href="javascript:;">更多>></a>
<h4>影片特别推荐</h4>
</div>
<div class="netbd clearfix">
<div class="netbdright fr">
<ul id="turn1">
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
</ul>
<ul class="clearfix bdul">
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p.jpg" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
</ul>
<ul class="clearfix bdul">
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p2.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
</ul>
<ul class="clearfix bdul">
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p3.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
</ul>
<ul class="clearfix bdul">
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p4.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
</ul>
<ul class="clearfix bdul">
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
<li title="刘华强">
<img src="img/180246p6.jpg" width="180" height="246" alt="" />
<div class="score">高清
<span>
5.9<i>分</i>
</span>
</div>
<div class="name">
<p>征服</p>
<span>怀念我们一起无聊的日子</span>
</div>
<div class="position">
<a href="javascript:;">
<div class="zi">
<h5>征服</h5>
<p>更新至第666集</p>
<p>探案 警匪</p>
<p>导演：美年达</p>
<p>主演：孙红雷</p>
</div>
<div class="tu"></div>
</a>
</div>
</li>
</ul>
</div>
<div class="playbdr fr">
<ul class="dsj" id="dsj1">
<li class="active" title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"><img src="img/toulan7.jpg" /></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"><img src="img/toulan7.jpg" /></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"><img src="img/toulan7.jpg" /></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<div class="tupian"><img src="img/toulan7.jpg" /></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"><img src="img/toulan7.jpg" /></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"><img src="img/toulan7.jpg" /></div>
</a>
</li>
<li title="闪电侠">
<div class="wenzi clearfix">
<i>1</i> 花千骨
<b></b>
<span>666.66万</span>
</div>
<a href="javascript:;">
<div class="tupian"></div>
</a>
</li>
</ul>
<div class="shaxuan">
<h3>电影筛选</h3>
<div class="sxn">
<p>类型：
<a href="javascript:;">偶像</a>
<a href="javascript:;">谍战</a>
<a href="javascript:;">历史</a>
<a href="javascript:;">都市</a>
</p>
<p>地区：
<a href="javascript:;">大陆</a>
<a href="javascript:;">港台</a>
<a href="javascript:;">海外</a>
<a href="javascript:;">美国</a>
</p>
<p>年份：
<a href="javascript:;">2015</a>
<a href="javascript:;">2014</a>
<a href="javascript:;">2013</a>
<a href="javascript:;">2012</a>
</p>
<p>演员：
<a href="javascript:;">唐嫣</a>
<a href="javascript:;">邓超</a>
<a href="javascript:;">王力宏</a>
<a href="javascript:;">周杰伦</a>
</p>
</div>
</div>
</div>
</div>
</div>
<div class="ygp">
<div class="ygphd clearfix">
<h2 class="fl">电影.预告片</h2>
<a class="more" href="javascript:;">更多>></a>
<p class="fr">电影.专题</p>
</div>
<div class="ygpbd clearfix">
<div class="tgpbdl fl">
<ul class="ygpul clearfix">
<li title="快没图了">
<img src="img/180100.jpg" alt="" />
<i></i>
<div>男神女神共同上演悬疑奇案</div>
<p>《我是证人》预告片</p>
</li>
<li title="快没图了">
<img src="img/180100.jpg" alt="" />
<i></i>
<div>男神女神共同上演悬疑奇案</div>
<p>《我是证人》预告片</p>
</li>
<li title="快没图了">
<img src="img/180100.jpg" alt="" />
<i></i>
<div>男神女神共同上演悬疑奇案</div>
<p>《我是证人》预告片</p>
</li>
<li title="快没图了">
<img src="img/180100.jpg" alt="" />
<i></i>
<div>男神女神共同上演悬疑奇案</div>
<p>《我是证人》预告片</p>
</li>
<li title="快没图了">
<img src="img/180100.jpg" alt="" />
<i></i>
<div>男神女神共同上演悬疑奇案</div>
<p>《我是证人》预告片</p>
</li>
</ul>
</div>
<div class="tgpbdr fr" title="老炮儿">
<img src="img/2401001.jpg" alt="" />
<div>小时代4：灵魂尽头</div>
<p>郭敬明：小时代第四部</p>
</div>
</div>
</div>
<div class="add1 clearfix">
<div class="addl fl clearfix" id="add1">
<a class="fl" href="javascript:;"></a>
<ul class="addul1 clearfix fr">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z3.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z3.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<div class="pointbox" id="point2">
<i class="active"></i>
<i></i>
<i></i>
</div>
</div>
</div>
<div class="zongyi" style="margin-bottom:20px;">
<div class="zongyihd clearfix">
<h2 class="fl">综艺</h2>
<ul class="fl zongyinav" id="zbtn">
<li class="active1">热门</li>
<li>选秀</li>
<li>情感</li>
<li>访谈</li>
</ul>
<p class="fr">人气综艺榜</p>
</div>
<div class="zongyibd clearfix">
<dl class="turnzongyi fl clearfix" id="trunz">
<dd class="bigzuo clearfix fl" style="display:block;">
<div class="bdl fl" title="这个还可以">
<img src="img/380254.jpg" alt="" />
<div class="opajx">2015-9-4期</div>
<p>美女脱口秀<br/><span>宋佳揭与大21岁前夫忘年恋 金星曝少年被打经历</span></p>
<div class="opaplay"></div>
</div>
<div class="bdm fl">
<ul class="bdmul clearfix">
<li>
<img src="img/toulan8.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan8.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan8.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan8.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan8.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan8.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
</ul>
</div>
</dd>
<dd class="bigzuo " style="background:#cf9;"></dd>
<dd class="bigzuo " style="background:#f90;"></dd>
<dd class="bigzuo " style="background:pink;"></dd>
</dl>
<div class="bdr fr">
<ul class="dby" id="dby">
<li class="active">
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
<li>
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
<li>
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
<li>
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
<li>
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
<li>
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
<li>
<div class="tu">
<img src="img/toulan9-1.jpg" alt="" />
</div>
<div class="zi1">
<img src="img/toulan9.jpg" alt="" />
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="zongyi">
<div class="zongyihd clearfix">
<h2 class="fl">动漫</h2>
<ul class="fl zongyinav" id="zbtn1">
<li class="active1">热门</li>
<li>选秀</li>
<li>情感</li>
<li>访谈</li>
</ul>
<p class="fr">每日更新</p>
</div>
<div class="zongyibd clearfix">
<dl class="turnzongyi fl clearfix" id="trunz1">
<dd class="bigzuo clearfix fl" style="display:block;">
<div class="bdl fl" title="这个还可以">
<img src="img/toulan10.jpg" alt="" />
<div class="opajx">2015-9-4期</div>
<p>动漫动漫动漫<br/><span>宋佳揭与大21岁前夫忘年恋 金星曝少年被打经历</span></p>
<div class="opaplay"></div>
</div>
<div class="bdm fl">
<ul class="bdmul clearfix">
<li>
<img src="img/toulan11.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan11.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan11.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan11.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan11.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
<li>
<img src="img/toulan11.jpg" />
<a href="javascript:;" class="wzl"></a>
</li>
</ul>
</div>
</dd>
<dd class="bigzuo " style="background:#cf9;"></dd>
<dd class="bigzuo " style="background:#f90;"></dd>
<dd class="bigzuo " style="background:pink;"></dd>
</dl>
<div class="bdr fr">
<div class="datehd">
<ul class="dateul clearfix" id="datebtn">
<li class="active">一</li>
<li>二</li>
<li>三</li>
<li>四</li>
<li>五</li>
<li>六</li>
<li>日</li>
</ul>
</div>
<div class="datebd" id="datebd">
<textarea style="background:pink;display:block"></textarea>
<textarea style="background:yellow;">是不是文本域</textarea>
<textarea style="background:#cf9;">是不是文本域</textarea>
<textarea style="background:#c90;">是不是文本域</textarea>
<textarea style="background:red;">是不是文本域</textarea>
<textarea style="background:#fff;">是不是文本域</textarea>
<textarea style="background:#939">是不是文本域</textarea>
<textarea style="background:#CC6">是不是文本域</textarea>
</div>
</div>
</div>
</div>
<div class="only">
<div class="onlyhd clearfix">
<h2 class="fl">独家策划</h2>
<ul class="clearfix onlyul fl" id="onlyul">
<li class="active">明星剧场</li>
<li>音乐会</li>
<li>体坛荷尔蒙</li>
<li>搞笑连播台</li>
<li>美女时尚</li>
</ul>
</div>
<div id="onlybdbox">
<div class="onlybd clearfix" style="display:block;">
<div class="obl fl hopa">
<img src="img/onlyl.jpg" alt="" />
<div class="menv">
<p>美国美女写真<br/><span>上衣险撑破</span></p>
</div>
</div>
<div class="obm fl">
<div class="mt clearfix">
<div class="mtl fl hopa">
<img src="img/mt1.jpg" />
<div class="menv">
<p>加拿大美女写真<br/><span>上衣险撑破</span></p>
</div>
</div>
<div class="mtr fr hopa">
<img src="img/mt2.jpg" alt="" />
<div class="menv">
<p>俄罗斯美女写真<br/><span>上衣险撑破</span></p>
</div>
</div>
</div>
<div class="mb clearfix">
<div class="mbl fl hopa">
<img src="img/mb1.jpg" alt="" />
<div class="menv">
<p>意大利美女写真<br/><span>上衣险撑破</span></p>
</div>
</div>
<div class="mbr fr hopa">
<img src="img/mb2.jpg" alt="" />
<div class="menv">
<p>日本美女写真<br/><span>上衣险撑破</span></p>
</div>
</div>
</div>
</div>
<div class="obr fr hopa">
<img src="img/rrr.jpg" alt="" style="margin-right:0px" />
<div class="menv">
<p>墨西哥美女写真<br/><span>上衣险撑破</span></p>
</div>
</div>
</div>
<div class="onlybd" style="height:430px"><img src="img/toulan21.jpg" alt="" /></div>
<div class="onlybd" style="height:430px"><img src="img/toulan22.jpg" alt="" /></div>
<div class="onlybd" style="height:430px"><img src="img/toulan23.jpg" alt="" /></div>
<div class="onlybd" style="height:430px"><img src="img/toulan24.jpg" alt="" /></div>
<div class="onlybd" style="height:430px"><img src="img/toulan21.jpg" alt="" /></div>
</div>
</div>
<div class="add1 clearfix">
<div class="addl fl clearfix" id="add3">
<a class="fl" href="javascript:;"></a>
<ul class="addul1 clearfix fr" style="display:block;">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z1.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z1.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<ul class="addul1 clearfix fr">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z2.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z2.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<ul class="addul1 clearfix fr">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z3.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z3.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<div class="pointbox" id="point3">
<i class="active"></i>
<i></i>
<i></i>
</div>
</div>
<div class="addl fr clearfix" id="add4">
<a class="fl" href="javascript:;"></a>
<ul class="addul1 clearfix fr" style="display:block;">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z1.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z1.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<ul class="addul1 clearfix fr">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z2.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z2.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<ul class="addul1 clearfix fr">
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z3.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
<li title="斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195">
<a class="clearfix boxa" href="javascript:;">
<img src="img/z3.jpg" alt=""/>
<div class="addbox fr">
<b>￥36.00</b>
<i>666好评</i>
<p>斯沃琪（Swatch）手表 SWATCH CLUB 25周年纪念特别版石英男士手表SUOZ195</p>
</div>
</a>
</li>
</ul>
<div class="pointbox" id="point4">
<i class="active"></i>
<i></i>
<i></i>
</div>
</div>
</div>
<div class="foot">
<ul class="footul clearfix">
<li><a href="javascript:;">意见反馈</a></li>
<li><a href="javascript:;">官方博客</a></li>
<li><a href="javascript:;">加入收藏</a></li>
<li><a href="javascript:;">版权申明</a></li>
<li><a href="javascript:;">关于我们</a></li>
<li style="border-right:none;"><a href="javascript:;">联系我们</a></li>
</ul>
<div class="clearfix foottxt">
<p>Copyright © 360安全网址. All Rights Reserved</p>
<p class="lasth"><a href="javascript:;">浙ICP证B2-20090064号</a></p>
<p> 信息网络传播视听节目许可证1109357号</p>
</div>
</div>
</body>
</html>
🏠 CSS样式代码
代码如下（示例）：
@charset "utf-8";
* {
padding: 0;
margin: 0;
}
body {
font-size: 12px;
font-family: '微软雅黑'
}
a {
color: #000;
text-decoration: none;
}
ul,
ol {
list-style: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 12px;
font-weight: normal;
}
b,
strong {
font-weight: normal;
}
i,
em {
font-style: normal;
}
a img {
display: block;
border: none;
}
img {
vertical-align: top;
border: none;
}
.clearfix:after {
clear: both;
display: block;
content: '';
}
.clearfix {
zoom: 1;
}
/*清除默认样式*/
body,
div,
p,
h1,
h2,
h3,
h4,
h5,
h6,
span,
ul,
ol,
li,
dl,
dd,
dt,
a,
i,
strong,
b,
em img,
form,
input {
margin: 0;
padding: 0;
}
ul li,
ol li {
list-style-type: none;
}
body {
line-height: 100%;
/*确保字体大小为设置值，消除不必要的空格*/
font-size: 12px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 100%;
font-size: 100%/*继承父级的字体大小*/
;
font-weight: normal;
}
a {
text-decoration: none;
}
img {
vertical-align: top;
}
a img {
border: none;
}
b,
strong {
font-weight: normal;
}
i,
em {
font-style: normal;
}
.clearFix:after {
clear: both;
display: block;
content: " ";
visibility: hidden;
height: 0;
line-height: 0;
}
.clearFix {
*zoom: 1;
}
.fl {
float: left;
display: inline;
}
.fr {
float: right;
display: inline;
}
textarea {
outline: none;
}
input {
padding: 0;
border: none;
outline: none;
background: none;
}
table {
border-collapse: collapse;
text-align: center;
vertical-align: middle;
}
四、📁 目录结构
├── css
│ ├── base.css
│ └── style.css
├── img
│ ├── 110601.jpg
│ ├── 110602.jpg
│ ├── 180 110.jpg
│ ├── 180100.jpg
│ ├── 1801001.jpg
│ ├── 180246.jpg
│ ├── 180246p.jpg
│ ├── 180246p2.jpg
│ ├── 180246p3.jpg
│ ├── 180246p4.jpg
│ ├── 180246p5.jpg
│ ├── 180246p6.jpg
│ ├── 180246p7.jpg
│ ├── 2401001.jpg
│ ├── 240120.jpg
│ ├── 380254.jpg
│ ├── add.png
│ ├── c1.jpg
│ ├── c2.jpg
│ ├── c3.jpg
│ ├── c4.jpg
│ ├── c5.jpg
│ ├── c6.jpg
│ ├── flash.gif
│ ├── greenplay.jpg
│ ├── largepic_bg.png
│ ├── logo.png
│ ├── mb1.jpg
│ ├── mb2.jpg
│ ├── mt1.jpg
│ ├── mt2.jpg
│ ├── my_ico.png
│ ├── onlyl.jpg
│ ├── pic0.jpg
│ ├── pic1.jpg
│ ├── pic2.jpg
│ ├── pic3.jpg
│ ├── pic4.jpg
│ ├── pic5.jpg
│ ├── pic6.jpg
│ ├── pic7.jpg
│ ├── pic8.jpg
│ ├── pic_0.jpg
│ ├── pic_01.jpg
│ ├── pic_02.jpg
│ ├── pic_03.jpg
│ ├── pic_04.jpg
│ ├── pic_05.jpg
│ ├── pic_06.jpg
│ ├── pic_07.jpg
│ ├── pic_08.jpg
│ ├── play_btn.png
│ ├── point.png
│ ├── rrr.jpg
│ ├── search_btn.png
│ ├── star.png
│ ├── t01f3aaf7cf737877f0.png
│ ├── todyhot1.jpg
│ ├── toulan1.jpg
│ ├── toulan10.jpg
│ ├── toulan11.jpg
│ ├── toulan2.jpg
│ ├── toulan21.jpg
│ ├── toulan22.jpg
│ ├── toulan23.jpg
│ ├── toulan24.jpg
│ ├── toulan3.jpg
│ ├── toulan4.jpg
│ ├── toulan5.jpg
│ ├── toulan6.jpg
│ ├── toulan7.jpg
│ ├── toulan8.jpg
│ ├── toulan9-1.jpg
│ ├── toulan9.jpg
│ ├── xiaoplay.png
│ ├── xiaoplay2.jpg
│ ├── xuzheng.jpg
│ ├── yg.png
│ ├── z1.jpg
│ ├── z2.jpg
│ └── z3.jpg
└── index.html
五、💡 博主建议
第一，明确学习目标
在进行学习时，无论是通过阅读、参加课程还是参与线下活动，都要设定清晰的目标。思考你想要解决的问题或希望实现的具体目标，这样能够更有针对性地进行学习。
第二，从实战中学习
单纯的理论学习往往难以记忆和应用，因此实践是关键。初学者可以通过模仿和重写已有的代码来加深理解。实战经验不仅能巩固基础，还能快速提升技能。
第三，建立个人知识体系
知识无穷无尽，面对浩瀚的书籍和信息，我们需要理清思路，避免迷失。每一个知识点都有其特定的背景和边界，通过归纳和整理，可以形成自己的知识体系，帮助更好地理解和应用。
第四，将所学应用于实践
学到的知识必须与实际工作和生活结合起来。每天学习的新知识应当与现实情况联系，通过实践来验证和深化理解。热爱学习是值得赞扬的，但能有效应用知识的人才是真正有价值的。
六、🎁 更多作品
如果我的博客对你有所帮助，或者你喜欢我的内容，请别忘了“👍点赞”、“✍️评论”和“❤️收藏”，支持我一下哦！
关注我获取更多源码，这里有丰富的前端插件、炫酷的3D效果、图片展示、文字效果，以及整站模板、大学生毕业HTML模板、期末大作业模板等！在这里，许多前端开发者聚集在一起，共同探讨前端和Node知识，互相学习！
👇🏻👇🏻👇🏻对于上述技术相关的技术问题有不懂的，欢迎随时免费交流学习👇🏻👇🏻👇🏻
扫一扫
422
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
