css布局爱心图片墙效果代码-html代码-BFW代码库

css布局爱心图片墙效果代码

代码语言：html

代码描述：css布局爱心图片墙效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>CSS3实现照片墙</title>
<style>
    @charset "utf-8";
* {
    padding: 0;
    margin: 0;
}

div {
    font-family: "微软雅黑";
    font-size: 14px;
    color: #666;
    padding: 0;
    margin: 0;
}

body,html{
    background: #eee;
    height: 100%;
}


/*css3实现照片墙的样式*/

.container {
    width: 100%;
    height: 100%;
    position: relative;
    background-color: beige;
    overflow: hidden;
     margin: 0 auto;
}

.container img {
    position: absolute;
    padding: 5px;
    height: 300px;
    width: 300px;
    background: #fff;
    border: 1px solid #ddd;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    z-index: 1;    
    top:50%;
    left:50%;
    -webkit-transform-origin:50% 50%;
    -moz-transform-origin:5.........完整代码请登录后点击上方下载按钮下载查看