html网页制作代码大全——大学生影视主题网页制作——图图影视影院5页HTML+

HTML实例网页代码, 本实例适合于初学HTML的同学 。该实例里面有设置了css的样式设置,有div的样式格局,这个实例比较全面,有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计 。
文章目录一、网页介绍
1 网页简介:此作品为学生个人主页网页设计题材,HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码,这是一个不错的网页制作,画面精明,代码为简单学生水平, 非常适合初学者学习使用 。
2.网页编辑:网页作品代码简单,可使用任意HTML编辑软件(如:、、 、 、、Text 、++ 等任意html编辑软件进行运行及修改编辑等操作) 。
3.知识应用:技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了Logo(源文件)所需的知识点 。
一、网页效果

html网页制作代码大全——大学生影视主题网页制作——图图影视影院5页HTML+

文章插图
二、代码展示1.HTML代码
代码如下(示例):以下仅展示部分代码供参考~




榜单



------图图影视影院
城市:沧州
定位城市:定位失败
定位失败
登录/
退出





  • 首页

  • 电影

  • 影院

  • 榜单

  • 热点



热映口碑榜最受期待榜国内票房榜

TOP

长津湖
梅兰芳
扬名立万
天书奇谭



商务合作邮箱:xxx@qq.com 客服电话:xxx违法和不良信息举报电话:xxx

xxx

图图影视影院




【html网页制作代码大全——大学生影视主题网页制作——图图影视影院5页HTML+】2.CSS代码
body{
margin: 0 100px;
padding: 0;
}
.box{
width: 1200px;
position: relative;
background: #FFF;
}
.box1{
width: 100%;
height: 125px;
background:url(../image/log.png) #FFF no-repeat;
background-size: 250px 125px;
}
a{
text-decoration: none;
color:#000;
}
.name{
width: 300px;
height: 125px;
position: absolute;
left: 270px;
top: 0px;
line-height: 125px;
text-align: center;
font-size:30px;
color:#00F;
}
.city1{
width: 87px;
height: 25px;
position: absolute;
left: 980px;
top: 30px;
line-height: 25px;
text-align: center;
}
.city2{
width: 146px;
height: 25px;
position: absolute;
left: 1056px;
top: 30px;
line-height: 25px;
text-align: center;
}
.city4 {
width:146px;
height:30px;
display: none;
position: absolute;
background-color:#CCC;
}
.city2:hover .city4 {
display: block;
}
.city2:hover{
border-bottom: 30px solid #666;
}
.login{
width: 70px;
height: 25px;
position: absolute;
left: 1107px;
top: 0px;
line-height: 25px;
text-align: center;
}
.exit{
width: 60px;
height: 25px;
position: absolute;
left: 1150px;