电子相册的制作代码
来源:互联网 发布:去掉原唱的软件 编辑:程序博客网 时间:2024/04/30 15:41
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="电子相册.css">
</head>
<body>
<!-- 内容区 -->
<div class="content">
<!-- tltle -->
<div class="content_title">
<span>电子相册</span>
<span>-天使在人间</span>
</div>
<!-- 展示区 -->
<div class="show_img clearfix">
<div class="left">
<ul>
<li id="img1"><img src="images/mn1.jpg" alt=""></li>
<li id="img2"><img src="images/mn2.jpg" alt=""></li>
<li id="img3"><img src="images/mn3.jpg" alt=""></li>
<li id="img4"><img src="images/mn4.jpg" alt=""></li>
<li id="img5"><img src="images/mn5.jpg" alt=""></li>
<li id="img6"><img src="images/mn6.jpg" alt=""></li>
<li id="img7"><img src="images/mn7.jpg" alt=""></li>
</ul>
</div>
<div class="right">
<ul>
<li ><a href="#img1" ><img src="images/s1.jpg" alt=""></a></li>
<li ><a href="#img2" ><img src="images/s2.jpg" alt=""></a></li>
<li ><a href="#img3" ><img src="images/s3.jpg" alt=""></a></li>
<li ><a href="#img4" ><img src="images/s4.jpg" alt=""></a></li>
<li ><a href="#img5" ><img src="images/s5.jpg" alt=""></a></li>
<li ><a href="#img6" ><img src="images/s6.jpg" alt=""></a></li>
<li ><a href="#img7" ><img src="images/s7.jpg" alt=""></a></li>
</ul>
</div>
</div>
<!-- 底部 -->
<div class="footer">
<p>奥熊丽 赫本</p>
<p>www.aodali</p>
</div>
</div>
</body>
</html>
@charset="utf-8";
*{margin: 0;padding: 0;}
.clearfix:after{content: "";display: block;clear: both;height: 0;}
.clearfix:{-ms-zoom:1;}
a{text-decoration: none;color: black;}
li{list-style: none;}
body{background-color: black;}
.content{width: 800px;height: 500px;margin: 0 auto;
border: 2px solid white;margin-top: 100px;}
.content_title{height: 100px;line-height: 100px;text-align: center;
}
.content_title span:first-child{color: white;font-size: 18px;
font-weight: bold;vertical-align: middle;}
.content_title span:last-child{color: white;font-size: 30px;
font-weight: bold;vertical-align: middle;}
.show_img>.left{overflow: hidden;width: 400px;height: 280px;
float: left;margin-left: 32px; }
.show_img>.right{float: right;overflow: scroll;width: 180px;height:280px;
}
.footer{margin-top: 20px;}
.footer p{color: white;}
.footer a{color: white;}
- 电子相册的制作代码
- 制作电子相册
- 制作电子相册
- Android端立体电子相册的制作
- 用PPT制作精美的专业电子相册
- Python编程:制作电子相册
- 简单电子相册视频制作的步骤和要点
- LINUX下的简单方便的电子相册制作工具VideoParama,可替代会声会汇制作简单的电子相册
- 电子相册V2代码
- 电子相册制作软件评测排名
- 用会声会影10制作高保真电子相册
- flash+xml 制作电子相册教程
- 用ASP制作一个电子相册,
- 会声会影如何制作简易电子相册
- 基于FRAMBUFFER 的电子相册
- 简易的电子相册
- 电子相册的软件框架
- java学习(给对象制作的简单的有背景音乐的电子相册)
- 封装图片上传、数据库、文件上传表单、跳转添加方法类
- 部分和问题
- 最优二叉搜索树(Optimal BST)-算法导论
- Windows下修改Git bash的HOME路径
- POJ2251Dungeon Master(3D bfs)
- 电子相册的制作代码
- JAVAWEB-GenericServlet的使用方法
- hdoj2352 Verdis Quo
- sicily 1569. Encrypted SMS
- Python 机器学习 简单实现
- 接口和抽象类的区别
- Binary Tree Level Order Traversal
- python 图像对比
- 存储过程