Skip to content

Commit

Permalink
update-blog
Browse files Browse the repository at this point in the history
  • Loading branch information
wuyouhua committed May 15, 2018
1 parent e1f8f7a commit 6a30e94
Show file tree
Hide file tree
Showing 8 changed files with 100 additions and 22 deletions.
56 changes: 49 additions & 7 deletions css/page/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,24 +42,28 @@
background-color: rgba(216, 216, 216, 0.35);
}

.area2 .library {
.area2 .library,
.area3 .tv {
padding: 40px 0;
}

.area2 .library .liblink {
.area2 .library .liblink,
.area3 .tv .tvlink {
color: rgba(0, 0, 0, 0.5);
font-size: 2rem;
margin: 20px 0;
font-weight: bold;
transition: all 0.3s ease-out;
}

.area2 .library .liblink:hover {
.area2 .library .liblink:hover,
.area3 .tv .tvlink:hover {
color: rgba(224, 90, 0, 0.8);
transform: scale(1.1);
}

.area2 .shelf {
.area2 .shelf,
.area3 .tvbox {
margin-top: 80px;
display: -webkit-inline-flex;
display: inline-flex;
Expand All @@ -71,23 +75,61 @@
width: 280px;
margin: 0 40px 25px 0;
padding: 0 20px;
background-color: rgba(139, 139, 139, 0.25);
transition: all 0.3s ease-out;
cursor: pointer;
}

.area2 .shelf .booklist:hover,
.area3 .tvbox .tvshow:hover {
box-shadow: #666 0 0 10px;
background-color: rgba(255, 255, 255, 0.7);
}

.area2 .shelf .booklist .book-pic {
padding: 0 50px;
}

.area2 .shelf .booklist img {
height: 200px;
margin-left: 50px;
margin-top: 20px;
transition: all 0.3s ease-out;
cursor: pointer;
}

.area2 .shelf .booklist img:hover {
transform: scale(1.2);
transform: scale(1.1);
}

.area2 .shelf .booklist .book-desc {
margin: 20px 0;
color: rgba(0, 0, 0, 0.8);
font-weight: bold;
}

.area3 .tv .tvbox .tvshow {
width: 33.3%;
transition: all 0.3s ease-out;
cursor: pointer;
}

.area3 .tv .tvbox .show-pic {
padding: 0 30px;
width: 100%;
}

.area3 .tv .tvbox img {
max-width: 366px;
margin-top: 20px;
transition: all 0.3s ease-out;
cursor: pointer;
margin-bottom: 30px;
}

.area3 .tv .tvbox img:hover {
transform: scale(1.1);
}

.area3 .tv .tvbox p {
padding: 0 25px;
margin-bottom: 40px;
}
Binary file added img/tv/avenger.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added img/tv/dragon.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added img/tv/langya.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
50 changes: 42 additions & 8 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,24 +78,34 @@
<div class="area2">
<div class="container">
<div class="library">
<a href="view/page/movie.html" class="liblink">Library
<i class="fa fa-arrow-right"></i>
</a>
<div>
<a href="view/page/library.html" class="liblink">Library
<i class="fa fa-arrow-right"></i>
</a>
</div>
<div class="shelf">
<div class="booklist book1">
<img src="img/book/shihuang.jpg" alt="">
<div class="book-pic">
<img src="img/book/shihuang.jpg" alt="">
</div>
<p class="book-desc">西方人眼中的恺撒，东方人眼中的千古一帝。</p>
</div>
<div class="booklist book2">
<img src="img/book/bojue.jpg" alt="">
<div class="book-pic">
<img src="img/book/bojue.jpg" alt="">
</div>
<p class="book-desc">为了复仇，但也不忘报恩，对所做的事情格外执着。</p>
</div>
<div class="booklist book3">
<img src="img/book/biancheng.jpg" alt="">
<div class="book-pic">
<img src="img/book/biancheng.jpg" alt="">
</div>
<p class="book-desc">一首哀婉凄美的田园牧歌，美得让人神往，脆弱得令人心疼。</p>
</div>
<div class="booklist book4">
<img src="img/book/jianai.jpg" alt="">
<div class="book-pic">
<img src="img/book/jianai.jpg" alt="">
</div>
<p class="book-desc">虽然是一个小人物，只要艰苦奋斗，也可能冲破阻碍达到目的。</p>
</div>
</div>
Expand All @@ -106,7 +116,31 @@
<div class="area3">
<div class="container">
<div class="tv">

<div>
<a href="view/page/movie.html" class="tvlink">TV
<i class="fa fa-arrow-right"></i>
</a>
</div>
<div class="tvbox">
<div class="tvshow show1">
<div class="show-pic">
<img src="img/tv/dragon.jpg" alt="">
</div>
<p>《龙珠》根据日本著名漫画家鸟山明的同名漫画改编，到目前共有4部TV动画(龙珠、龙珠GT、龙珠Z、龙珠超)，剧场版电影:复活的弗利萨。漫画讲述了主人公孙悟空的一系列成长经历。</p>
</div>
<div class="tvshow show2">
<div class="show-pic">
<img src="img/tv/avenger.jpg" alt="">
</div>
<p>该片讲述复仇者联盟和他们的超级英雄盟友们必须愿意牺牲一切，才能在灭霸毁灭宇宙之前将其击败。</p>
</div>
<div class="tvshow show3">
<div class="show-pic">
<img src="img/tv/langya.jpg" alt="">
</div>
<p>《琅琊榜》根据海宴同名网络小说改编，以平反冤案、扶持明君、振兴山河为主线，讲述了“麒麟才子”梅长苏才冠绝伦、以病弱之躯拨开重重迷雾、智博奸佞，为昭雪多年冤案、扶持新君所进行的一系列斗争。</p>
</div>
</div>
</div>
</div>
</div>
Expand Down
0 js/music/checked.js → js/music/navfold.js
View file
File renamed without changes.
4 changes: 2 additions & 2 deletions view/page/game.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -190,7 +190,7 @@ <h2>
<a href="">World of Warcraft(魔兽世界)</a>
</h2>
<div class="game-desc">
<p>魔兽世界》是由著名游戏公司暴雪娱乐所制作的第一款网络游戏，属于大型多人在线角色扮演游戏。游戏以该公司出品的即时战略游戏《魔兽争霸》的剧情为历史背景，依托魔兽争霸的历史事件和英雄人物，魔兽世界有着完整的历史背景时间线。
<p>《魔兽世界》是由著名游戏公司暴雪娱乐所制作的第一款网络游戏，属于大型多人在线角色扮演游戏。游戏以该公司出品的即时战略游戏《魔兽争霸》的剧情为历史背景，依托魔兽争霸的历史事件和英雄人物，魔兽世界有着完整的历史背景时间线。
玩家在魔兽世界中冒险、完成任务、新的历险、探索未知的世界、征服怪物等。</p>
</div>
</div>
Expand All @@ -202,7 +202,7 @@ <h2>
<a href="">NieR:Automata(尼尔:机械纪元)</a>
</h2>
<div class="game-desc">
<p>《尼尔：机械纪元》故事背景设定在遥远的未来，讲述在被摧毁的地球上由人类的敌人外星人派来的机械生命体与人类方派出的人造人“尤尔哈”部队进行战斗的故事</p>
<p>《尼尔：机械纪元》故事背景设定在遥远的未来，讲述在被摧毁的地球上由人类的敌人外星人派来的机械生命体与人类方派出的人造人“尤尔哈”部队进行战斗的故事。</p>
</div>
</div>
<div class="list">
Expand Down
12 changes: 7 additions & 5 deletions view/page/music.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -119,9 +119,11 @@
<button class="btn-fun" id="allselect">全选</button>
<button class="btn-fun" id="cancle">取消</button>
<button class="btn-fun" id="reverse">倒置选中</button>
<a href="" class="moremusic fr">更多
<i class="fa fa-arrow-right"></i>
</a>
<div>
<a href="" class="moremusic">更多
<i class="fa fa-arrow-right"></i>
</a>
</div>
</div>
<div class="music-list">
<div>
Expand Down Expand Up @@ -448,14 +450,14 @@
<p class="duration">03:56</p>
<p class="classification">摇滚</p>
</label>
</div>
</div>
</div>

</div>
</div>
</div>
</body>
<script src="../../js/main.js"></script>
<script src="../../js/music/checked.js"></script>
<script src="../../js/music/navfold.js"></script>

</html>

0 comments on commit 6a30e94

Please sign in to comment.