HTML视频&电影网站实例网页代码，该实例里面有设置了css的样式设置，有div的样式格局，这里会介绍如何设计个人网站及web网页制作。（如需源码，可以私信回复“电影”并留下邮箱，或关注GZ号“IT黄大大”）
实例视频&电影网站效果图：
<li>其他</li>
</ul>
</div>
</div>
<div class="text_intr">
<h3>代表作品</h3>
<hr>
<table width="100%">
<tr>
<td class="t_right" width="25%">作品名：</td>
<td width="65%">超人</td>
</tr>
<tr>
<td class="t_right" width="25%">创刊号：</td>
<td width="65%">1938年6月</td>
</tr>
<tr>
<td class="t_right" width="25%">所属团队：</td>
<td width="65%">正义联盟、超级英雄军团</td>
</tr>
</table>
<h3>故事简介</h3>
<hr>
<div class="intr">
漫画史上第一位超级英雄。本名卡尔-艾尔（Kal-El），出生于氪星（Krypton）。在氪星面临毁灭之际，他的父母为其找到了浩瀚宇宙中的新家园——地球，用飞船送走了尚在襁褓中的爱子。飞船坠落在美国堪萨斯州的斯莫维尔（Smallville），卡尔被农场主肯特夫妇捡到，并以克拉克·肯特（Clark Kent）的地球名字抚养成人。</p><p>
长大后，克拉克成为大都会（Metropolis）《星球日报》 的一名新闻记者。他有着与生俱来的超能力和极强的正义感与同情心，每次在危机时刻，便穿上蓝色紧身衣，披上红色斗蓬，化身超人行侠仗义，拯救人类。
</div>
</div>
</div>
</div>
</div>
<div class="footer"></div>
首页Css代码
body,
html {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
background-color: #D3D3D3;
}
.main {
width: 63%;
height: 700px;
margin: 60px auto;
}
.head {
width: 100%;
height: 50px;
border-bottom: 2px solid #999;
}
.menu {
float: left;
}
.self_intr {
width: 100%;
margin: 30px 0;
height: 650px;
float: left;
background-color: #EEEEEE;
}
hr {
width: 80%;
margin: 0 auto;
}
h2 {
width: 80%;
margin-left: 10%;
}
.img_text {
width: 80%;
margin-left: 10%;
}
.img_left {
float: left;
width: 350px;
height: 600px;
margin: 30px 20px;
}
.img_left img {
margin-bottom: 20px;
}
.aihao_li {
width: 250px;
height: 300px;
margin-top: 20px;
}
.aihao_li ul li {
height: 30px;
list-style: none;
color: blue;
}
.text_intr {
width: 500px;
height: 340px;
float: left;
margin-top: 30px;
}
table {
width: 80%;
background-color: #ddd;
height: 100px;
margin: 0 auto;
}
.t_right {
text-align: right;
}
tr td {
height: 25px;
line-height: 20px;
}
h3 {
margin-left: 40px;
}
.intr {
margin: 10px 40px;
line-height: 35px;
color: #666;
font-size: 13px;
}
.menu img {
float: left;
}
.h1 {
float: left;
font-size: 24px;
}
.head ul {
list-style: none;
float: left;
margin-left: 120px;
}
.head ul li {
float: left;
width: 120px;
text-align: center;
}
.active {
color: rgb(101, 197, 165);
}
ul a {
float: left;
}
由于格式问题，只展示了《首页》的代码，《超人栏目》《海王栏目》《留言栏目》就上截图了，需要的小伙伴关注公众号“IT黄大大”获取源码直接下载。
超人html代码
超人Css代码
海王html代码
海王Css代码
留言html代码
留言Css代码
注：可能里面的一些图片没有显示，想要完整包的同学们可以留言或关注公众号，这边有时间第一时间给你们发哦。