Blog Thiết Kế

Hướng dẫn và giải đáp cho bạn những kĩ thuật trong việc sử dụng Yahoo! Blog, nơi bạn tìm thấy những theme đẹp, giúp bạn làm quen và tìm hiểu về cách tuỳ chỉnh Blog và học hỏi kinh nghiệm thiết kế Blog.

Post sort order : index

35/117 POSTS
preview
34-36/117 POSTS

close

[Bài thi thiết kế] ĐEN & TRẮNG

Aug 13, 2012 6:50 PMPublicPageviews 1407 12

   Vào một chiều cuối tuần,lang thang trên phố tình cờ lạc vào quán cafe ĐEN & TRẮNG,tôi thật sự rất ấn tượng với kiểu trang trí của quán,hầu như các màu sắc đều bị loại bỏ chỉ còn lại ĐEN & TRẮNG,vừa nhâm nhi café vừa nghe những tình khúc bất hủ được phát với âm lượng vừa đủ nghe tôi thấy lòng lắng đọng lại và nảy sinh ý tưởng cho theme “ĐEN & TRẮNG” nầy,chỉ có trắng đen và âm nhạc.


DEMO:




CODE :



<style type="text/css">

<!--

body{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/nenden.png);}

#hd {margin-bottom:0px;border-bottom:0px solid white;background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/hd1.png) repeat-y center bottom;height:630px;}

#asb-header {height:462px;}

#bd {background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/nen-1.png) repeat-y center;}

#ft {background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/ft4.jpg) no-repeat top center;height:289px;margin-top:0px;font-size:0px;border-top:0px;}

#article-top-nav, #article-carousel, #pagination-bottom, .sidebar, #article-single, #article-supplement, #article-bottom-nav, #article-supplement, #asb-menu ul, #comment-list .comment-reply {background:transparent !important;}.divider {display:none;}#ft{font-size:0px;border-top:none;}#emotion-carousel, #article-top-nav{display:none;}#asb-nav .divider , #asb-nav-update-ctn, #asb-nav-logo{display:none;}#asb-uh{border:none;}#hd{border-bottom:0;}#asb-uh, #asb-nav, #asb-nav-logo {background-color:transparent;}#asb-nav-search{display:none;}#asb-nav-search button{height:0px;width:0px;font-size:0px;}#asb-nav-search span.search-primary, #emotion-carousel, #asb-nav-search span.search-secondary{background:transparent;}

#article-supplement.new-style-supplement {border-bottom:none;}#article-single.bd, #pagination-bottom, #article-supplement, #article-top-nav, #article-bottom-nav, #emotion-carousel, .sidebar, .new-style-supplement , .widget{border:none;}.yui-b #sidebar2 {border:none;}

#asb-menu ul{border:none;}

#blog-title, #blog-description{display:none;}

#widget-statistic h3{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/tdTK-2.png) no-repeat left;height:90px;}

#widget-recentVisitor h3{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/khach.png) no-repeat left;height:90px;}

#widget-recentPost h3{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/tdpost2a.png) no-repeat left;height:90px;}

#widget-recentComment h3{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/cnt.png) no-repeat left;height:90px;}

#widget-category h3{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/nhom.png) no-repeat left;height:90px;}

#widget-followingList h3 {background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/thich.png) no-repeat left;height:90px;}

#widget-calendar .hd{background:url(http://i1172.photobucket.com/albums/r579/huandrums5/lich.png) no-repeat left;height:90px;}

#widget-photoSlide h3{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/anh.png) no-repeat left;height:90px;}

#comment-form{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/nencom1.png);height:180;}

#widget-tag .hd, #widget-followingList h3, #widget-calendar .hd, #widget-recentVisitor .hd, #widget-externalSource .hd, #widget-statistic .hd, #widget-category .hd, #widget-recentPost .hd, #widget-recentComment .hd, #widget-photoSlide .hd{font-size:0px;}

#asb-menu li.first, #asb-menu li.current a, #asb-menu li{border:0;background:url(http://i1172.photobucket.com/albums/r579/huandrums5/nutbam2.png) no-repeat;}

#asb-menu li.current{background:transparent;}

#asb-menu li.first, #asb-menu li a, #asb-menu li.current a{border:0;color:#FFFFFF;}

#widget-recentPost li, #widget-recentComment li {list-style-image:url(http://i1151.photobucket.com/albums/o627/huandrums4/icon-1.gif);}

#widget-category li .ico{background:url(http://i1151.photobucket.com/albums/o627/huandrums4/icon-1.gif) top left;height:6px;width:7px;}

a:hover{background-image:url(http://i1151.photobucket.com/albums/o627/huandrums4/sao-1.gif);}

a , body{color:#000000;}

#comment-list .comment-reply , #article-supplement{font-size:14px;}

#article-single

.article .title{font-size:22px;color:#000000;}

.yui-b .sidebar{font-size:14px;}

#widget-photoSlide .count, #article-listing .article .meta, #article-single .article .meta, #widget-category li em, #comment-list .comment-content .meta .time, #article-navigation .hd {color:#000000;}

.yut-btn-light {background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/nutthich-1.png) no-repeat;height:22px;width:83px;border:none;}

.yut-btn-light a {color:#000000;}

.yut-btn{background:transparent url(http://i1172.photobucket.com/albums/r579/huandrums5/nutcmt3.png) no-repeat;height:28px;width:57px;border:none;}

.yut-btn button, .yut-btn-light a{color:#FFFFFF;}

#w-profile-name{color:#fff;text-shadow:#000000 0.1em 0.1em 0.2em;font-weight:bold;font-size:16px;text-align:center;}

#w-profile-status .status-bubble {background:none;}

.yut-pg-container .pg-current-page{background-color:#000000;border:4px outset #000000;}

#pagination-bottom .pg-page {background-color:#CACACA;}

#widget-recentPost li time, #widget-recentComment li time{font-size:0px;}

#article-single,

#article-list {background:transparent;}

#article-list, .article-listing-bd {background:transparent;border:none;padding-left:20px;}

#article-listing .article .title{margin:10px 5px 10px 5px;border-bottom:5px solid #ccc;padding:7px;font-family:Georgia, Times, serif;font-size:110%;color:#FFFFFF;background:#000000;}

#article-listing .article .meta,

#article-listing .article .category,

#article-listing .article .tag,

#article-listing .article .actions{display:none;}

#article-list{float:left;padding:0px;}

.article-listing-ft{float:left;width:717px;}

#article-listing .article {width:322px;height:200px;float:left;margin:15px;border:3px solid #999;padding-top:0px;}

#article-listing .img-wrap img{float:left;max-width:115px;height:auto;max-height:150px;border:1px solid #CCC;padding:5px;margin:5px;}

#article-listing .article .summary-short{display:block;font-family:Times;font-weight:lighter;font-size:16px;text-align:justify;padding:5px 5px 5px 5px;}

#article-listing .article .summary{display:none;}

#article-listing .first-of-type{width:679px!important;height:280px!important;display:block;margin:15px!important;}

#article-listing .first-of-type .img-wrap img{float:left;width:290px!important;height:200px!important;max-width:290px;max-height:200px;}

#article-listing .first-of-type .summary{display:block;font-family:Georgia, Times, serif;font-weight:lighter;font-size:16px;text-align:justify;padding:10px 10px 10px 300px;}

#article-listing .first-of-type .summary-short{display:none;}

#article-listing .first-of-type .meta{display:block;text-align:center;color:#666;}

#article-listing .first-of-type .more{display:none;}

#article-listing .first-of-type .title{font-size:120%;}

#article-listing .article .title{padding-left:15px;}

-->

</style>



Cách cho code vào Nguồn bên ngoài:XEM TẠI ĐÂY

Blog HUANDRUMS

Report abuse for this article

Copyright © 2013 Yahoo!, Inc. All rights reserved