Commit f022ced9 authored by “yeahzzzz”'s avatar “yeahzzzz”

作业

parent 49003b78
*{
padding: 0px;
margin: 0px;
}
body{
margin: 0 auto;
}
.nav{
height: 60px;
border: 1px solid #ed4934;
margin: 0 auto;
color: white;
background:#ed4934;
}
.nav-wrap{
width: 1000px;
margin: 0 auto;
}
.nav-wrap p{
display: inline-block;
line-height: 60px;
}
.nav-wrap p:hover{
background: linear-gradient( rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) );
}
.nav-left{
display: inline-block;
}
.nav-right{
float: right;
}
.nav-left p{
font-size: 30px;
}
.nav-right p{
margin-left: 27px;
}
.header{
height: 530px;
border: 1px solid black;
background-image: url("images/mainback.jpg");
background-repeat: no-repeat;
}
.header-wrap{
width: 1000px;
height: 380px;
margin: 70px auto;
border: 1px solid #ed4934;
}
.hd-left{
padding: 25px;
width: 55%;
height:80%;
border: 1px solid #ed4934;
display: inline-block;
background-color: white;
}
.left-content-wrap1{
width: 180px;
height: 35px;
border: 1px solid black;
line-height:35px;
border-radius: 25px;
background-color: #ED4934;
color: white;
}
.left-content-wrap1 p{
font-weight: bold;
}
.left-content-wrap1 img{
margin: 10px;
}
.left-content-wrap2{
font-size: 50px;
}
.hd-left div{
margin: 20px;
}
.hd-right{
text-align: center;
width: 30%;
height:80%;
border: 1px solid #ed4934;
float: right;
background-color: #ED4934;
}
.right-content-wrap1 img{
height: 50%;
width: 50%;
}
.right-content-wrap2{
font-size: 30px;
margin-bottom: 20px;
}
.right-content-wrap3{
font-size: 50px;
margin-bottom: 20px;
}
.main{
height: 660px;
border: 1px solid green;
background-image: url("images/back.png");
}
.main-wrap1{
text-align: center;
width: 500px;
margin: 0 auto;
border: 1px solid #ed4934;
}
.main-wrap1 div{
margin: 25px;
}
.main-wrap1 .title1{
font-size: 30px;
}
.main-wrap2{
text-align: center;
width: 900px;
margin: 0 auto;
border: 1px solid #ed4934;
/* overflow: hidden; */
/* line-height: 80px; */
}
.main-wrap2 .content1{
display: inline-block;
width: 30%;
border: 1px solid #ed4934;
overflow: hidden;
}
.main-wrap2 .content2{
display: inline-block;
width: 30%;
border: 1px solid #ed4934;
overflow: hidden;
}
.main-wrap2 .content3{
display: inline-block;
width: 30%;
border: 1px solid #ed4934;
overflow: hidden;
}
.redheart-wrap img{
width: 50%;
height: 50%;
}
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="cssTest3.css">
<title></title>
</head>
<body>
<div class="nav">
<div class="nav-wrap">
<div class="nav-left">
<p>Robert & Emily</p>
</div>
<div class="nav-right">
<p>HOME</p>
<p>ABOUT</p>
<p>PHOTOS</p>
<p>WEDDING</p>
<p>RSVP</p>
</div>
</div>
</div>
<div class="header" >
<div class="header-wrap">
<div class="hd-left">
<div class="left-content-wrap1">
<img src="./images/信号.svg" style="height:15px; width:15px; float: left; display: block;"alt="">
<p style="float: left; margin:0px">MARRIAGE ON</p>
</div>
<div class="left-content-wrap2">
大文字<br>
大文字
</div>
<div class="left-content-wrap3">
斜文字斜文字斜文字斜文字斜文字斜文字斜文字斜斜文字斜文字斜文字文字
斜文字斜文字斜文字斜文字斜文字斜文字斜文字斜斜文字斜文字斜文字文字
斜文字斜文字斜文字斜文字斜文字斜文字斜文字斜斜文字斜文字斜文字文字
</div>
</div>
<div class="hd-right">
<div class="right-content-wrap1">
<img src="images\whitelovesvg.svg" alt="">
</div>
<div class="right-content-wrap2">
12.DEC
</div>
<div class="right-content-wrap3">
2014
</div>
</div>
</div>
</div>
<div class="main">
<div class="main-wrap1">
<div class="title1">
ABOUT US
</div>
<div class="logo1">
<img src="./images/border.png" alt="border-img">
</div>
<div class="content1">
longlonglonglonglonglonglonglonglong
longlonglonglonglonglonglonglonglong
longlonglonglonglonglonglonglonglong
longlonglonglonglonglonglonglonglong
</div>
<div class="logo1">
<img src="./images/border.png" alt="border-img">
</div>
</div>
<div class="main-wrap2">
<div class="content1">
<div class="ct1-tit">
ROBERT
</div>
<div class="ct1-context">
longlonglonglonglonglonglonglong
longlonglonglonglonglonglonglong
longlonglonglonglonglonglonglong
longlonglonglonglonglonglonglong
</div>
</div>
<div class="content2">
<div class="redheart-wrap">
<img src="./images/love.png" alt="">
</div>
<div class="ct2-date">
12,DEC 2014
</div>
</div>
<div class="content3">
<div class="ct3-tit">
EMILY
</div>
<div class="ct3-context">
longlong
longlong
longlong
longlong
</div>
</div>
</div>
</div>
</body>
</html>
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551249019704" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1570" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M846.3104 562.304c-1.5104 2.0416-3.1872 4-5.0432 5.8496l-293.056 293.056a51.2 51.2 0 0 1-72.4032 0L185.8496 571.264a51.5328 51.5328 0 0 1-5.6384-6.688C132.48 522.2016 102.4 460.2752 102.4 391.3024c0-127.7184 103.1552-231.2576 230.4-231.2576 72.384 0 136.96 33.4976 179.2 85.888 42.24-52.3904 106.816-85.888 179.2-85.888 127.2448 0 230.4 103.5392 230.4 231.2576 0 67.7504-29.0304 128.704-75.2896 170.9952z" fill="#d81e06" p-id="1571"></path></svg>
\ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551248549411" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1457" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M846.3104 562.304c-1.5104 2.0416-3.1872 4-5.0432 5.8496l-293.056 293.056a51.2 51.2 0 0 1-72.4032 0L185.8496 571.264a51.5328 51.5328 0 0 1-5.6384-6.688C132.48 522.2016 102.4 460.2752 102.4 391.3024c0-127.7184 103.1552-231.2576 230.4-231.2576 72.384 0 136.96 33.4976 179.2 85.888 42.24-52.3904 106.816-85.888 179.2-85.888 127.2448 0 230.4 103.5392 230.4 231.2576 0 67.7504-29.0304 128.704-75.2896 170.9952z" fill="#ffffff" p-id="1458"></path></svg>
\ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1551249147058" class="icon" style="" viewBox="0 0 1294 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3939" xmlns:xlink="http://www.w3.org/1999/xlink" width="252.734375" height="200"><defs><style type="text/css"></style></defs><path d="M0 727.578947l188.631579 0 0 296.421053-188.631579 0 0-296.421053Z" fill="#ffffff" p-id="3940"></path><path d="M269.473684 565.894737l188.631579 0 0 458.105263-188.631579 0 0-458.105263Z" fill="#ffffff" p-id="3941"></path><path d="M565.894737 377.263158l161.684211 0 0 646.736842-161.684211 0 0-646.736842Z" fill="#ffffff" p-id="3942"></path><path d="M835.368421 188.631579l188.631579 0 0 835.368421-188.631579 0 0-835.368421Z" fill="#ffffff" p-id="3943"></path><path d="M1104.842105 0l188.631579 0 0 1024-188.631579 0 0-1024Z" fill="#ffffff" p-id="3944"></path></svg>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment