Skip to content

W
www.fudou6.com
Commit 47535ee3 authored by liaili's avatar liaili
Browse files
Options

1

parent c4ac36eb
Hide whitespace changes
Inline Side-by-side
Showing with 113 additions and 115 deletions
public/stylesheets/index.css
View file @ 47535ee3
...@@ -246,6 +246,41 @@ ...@@ -246,6 +246,41 @@
.products ul li:nth-child(2) > div:last-child { .products ul li:nth-child(2) > div:last-child {
width: 313.33333333px; width: 313.33333333px;
background-color: #2e2e2e; background-color: #2e2e2e;
text-align: center;
}
.products ul li:nth-child(1) > div:last-child h3,
.products ul li:nth-child(2) > div:last-child h3 {
font-size: 40px;
margin-top: 80px;
text-align: center;
}
.products ul li:nth-child(1) > div:last-child hr,
.products ul li:nth-child(2) > div:last-child hr {
width: 237px;
border: none;
border-bottom: 1px solid #979797;
margin: 7px auto 20px;
}
.products ul li:nth-child(1) > div:last-child > div,
.products ul li:nth-child(2) > div:last-child > div {
width: 100%;
margin-bottom: 24px;
}
.products ul li:nth-child(1) > div:last-child > div span,
.products ul li:nth-child(2) > div:last-child > div span {
width: 33%;
display: block;
float: left;
font-size: 16px;
}
.products ul li:nth-child(1) > div:last-child > div span strong,
.products ul li:nth-child(2) > div:last-child > div span strong {
font-size: 30px;
}
.products ul li:nth-child(1) > div:last-child a,
.products ul li:nth-child(2) > div:last-child a {
font-size: 24px;
color: #fff;
} }
.products ul li:nth-child(n+3) { .products ul li:nth-child(n+3) {
float: left; float: left;
...@@ -265,89 +300,4 @@ ...@@ -265,89 +300,4 @@
.products ul li:nth-child(n+3) > div:first-child { .products ul li:nth-child(n+3) > div:first-child {
background-size: cover; background-size: cover;
} }
@media screen and (min-width: 1025px) {
.products ul {
width: 1000px;
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 656.66666667px;
margin-right: 30px;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 313.33333333px;
}
.products ul li:nth-child(n+3) {
width: 313.33333333px;
}
}
@media screen and (min-width: 1281px) {
.products ul {
width: 1100px;
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 723.33333333px;
margin-right: 30px;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 346.66666667px;
}
.products ul li:nth-child(n+3) {
width: 346.66666667px;
}
}
@media screen and (min-width: 1367px) {
.products ul {
width: 1200px;
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 790px;
margin-right: 30px;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 380px;
}
.products ul li:nth-child(n+3) {
width: 380px;
}
}
@media screen and (min-width: 1441px) {
.products ul {
width: 1350px;
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 890px;
margin-right: 30px;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 430px;
}
.products ul li:nth-child(n+3) {
width: 430px;
}
}
@media screen and (min-width: 1921px) {
.products ul {
width: 1500px;
}
.products ul li:nth-child(1) > div:first-child,
.products ul li:nth-child(2) > div:first-child {
width: 990px;
margin-right: 30px;
}
.products ul li:nth-child(1) > div:last-child,
.products ul li:nth-child(2) > div:last-child {
width: 480px;
}
.products ul li:nth-child(n+3) {
width: 480px;
}
}
/*product end*/ /*product end*/
public/stylesheets/index.less
View file @ 47535ee3
...@@ -260,6 +260,35 @@ ...@@ -260,6 +260,35 @@
&:last-child { &:last-child {
width: (@container-width + 30)/3-30; width: (@container-width + 30)/3-30;
background-color: #2e2e2e; background-color: #2e2e2e;
text-align: center;
h3 {
font-size: 40px;
margin-top: 80px;
text-align: center;
}
hr {
width: 237px;
border: none;
border-bottom: 1px solid #979797;
margin: 7px auto 20px;
}
& > div {
width: 100%;
margin-bottom: 24px;
span {
width: 33%;
display: block;
float: left;
font-size: 16px;
strong {
font-size: 30px;
}
}
}
a {
font-size: 24px;
color: #fff;
}
} }
} }
} }
...@@ -271,8 +300,8 @@ ...@@ -271,8 +300,8 @@
margin-right: 30px; margin-right: 30px;
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
& > div { & > div {
position: absolute; position: absolute;
width: 100%; width: 100%;
...@@ -281,18 +310,19 @@ ...@@ -281,18 +310,19 @@
background-size: cover; background-size: cover;
} }
} }
} }
} }
} }
} }
/*product end*/
.screen() { .screen() {
.media(1025px, 1000px); .media(1281px, 1000px);
.media(1281px, 1100px); .media(1441px, 1200px);
.media(1367px, 1200px);
.media(1441px, 1350px);
.media(1921px, 1500px);
} }
.media(@sw, @cw) { .media(@sw, @cw) {
...@@ -302,29 +332,25 @@ ...@@ -302,29 +332,25 @@
} }
.rules(@container-width) { .rules(@container-width) {
ul { .products {
width: @container-width; ul {
li { width: @container-width;
&:nth-child(1), li {
&:nth-child(2) { &:nth-child(1),
& > div { &:nth-child(2) {
&:first-child { & > div {
.cwidth(@container-width); &:first-child {
} .cwidth(@container-width);
&:last-child { }
width: (@container-width + 30)/3-30; &:last-child {
width: (@container-width + 30)/3-30;
}
} }
} }
} &:nth-child(n+3) {
&:nth-child(n+3) { width: (@container-width + 30)/3-30;
width: (@container-width + 30)/3-30; }
} }
} }
} }
} }
\ No newline at end of file
.products {
.screen();
}
/*product end*/
public/stylesheets/style.less
View file @ 47535ee3
...@@ -125,4 +125,21 @@ hr.line-separate { ...@@ -125,4 +125,21 @@ hr.line-separate {
/*footer end*/ /*footer end*/
.screen() {
.media(1281px, 1000px);
.media(1441px, 1200px);
}
.media(@sw, @cw) {
@media screen and (min-width: @sw) {
.rules(@cw);
}
}
.rules(@container-width) {
#header {
.container {
width: @container-width;
}
}
}
routes/index.js
View file @ 47535ee3
...@@ -5,7 +5,9 @@ var router = express.Router(); ...@@ -5,7 +5,9 @@ var router = express.Router();
router.get('/', function(req, res, next) { router.get('/', function(req, res, next) {
res.render('index', { res.render('index', {
page: 'index', page: 'index',
abcd:123, character:[
],
products:[ products:[
{ {
title:'中电投西安', title:'中电投西安',
......
views/index.hbs
View file @ 47535ee3
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
</div> </div>
<div class="character"> <div class="character">
<ul class="clear"> <ul class="clear">
{{#each character}}
<li> <li>
<div> <div>
<h3>1000亿</h3> <h3>1000亿</h3>
...@@ -38,6 +39,7 @@ ...@@ -38,6 +39,7 @@
<h4>一手资源，从融资方直接取得项目资源</h4> <h4>一手资源，从融资方直接取得项目资源</h4>
</div> </div>
</li> </li>
{{/each}}
<li> <li>
<div> <div>
<h3>1000亿</h3> <h3>1000亿</h3>
...@@ -117,7 +119,8 @@ ...@@ -117,7 +119,8 @@
<div style="background-image:url({{this.img}})"></div> <div style="background-image:url({{this.img}})"></div>
<div> <div>
<h3>{{this.title}}</h3> <h3>{{this.title}}</h3>
<div> <hr/>
<div class="clear">
<span> <span>
<strong>{{this.raiseTime}}</strong>天<br/>募集时间 <strong>{{this.raiseTime}}</strong>天<br/>募集时间
</span> </span>
......
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