HTML实例网页代码, 本实例适合于初学HTML的同学 。该实例里面有设置了css的样式设置,有div的样式格局,这个实例比较全面,有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计 。
文章目录一、网页介绍
1 网页简介:此作品为学生个人主页网页设计题材,HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码,这是一个不错的网页制作,画面精明,代码为简单学生水平, 非常适合初学者学习使用 。
2.网页编辑:网页作品代码简单,可使用任意HTML编辑软件(如:、、 、 、、Text 、++ 等任意html编辑软件进行运行及修改编辑等操作) 。
3.知识应用:技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了Logo(源文件)所需的知识点 。
一、网页效果
![html网页制作代码大全——大学生影视主题网页制作——图图影视影院5页HTML+](http://img.gansulong.com/231012/0R01124B-0.png)
文章插图
二、代码展示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;
- 用GitHub Copilot在Vs Code里快速写代码,最详细使用教程
- 统计二进制1个数的代码解读
- HTML的命名空间什么意思,就是html标签内xmlns后面一个网址的那个_百
- html页面管理器,HTML5存储管理器多合一插件
- 如何实现商品规格参数查询代码(通过三级类目的cid查找数据表里全部对应cid的信
- Python数据类型结构
- 软件开发:站在风口上的低代码
- 松灵机器人SCOUT的ROS代码架构
- 去敲代码,去敲不被定义的代码,值得收藏的【C语言】编程训练题
- 六. 代码版本管理