[Bài thi thiết kế] Sunny Sad (Nắng buồn) | Blog

Thi thiết kế theme

[Bài thi thiết kế] Sunny Sad (Nắng buồn)

Jul 29, 2012 10:29 PMPublicPageviews 4840 31

Trackback from [Bài thi thiết kế] Sunny Sad (Nắng buồn)

1.Chủ đề thiết kế và cảm nhận:
Theme Sunny Sad lấy tông màu chủ đạo là màu nắng nhạt, mang hơi hướng của một mùa hè tĩnh lặng, không ồn ào, sôi động, náo nhiệt. Ngược lại, theme thể hiện được tâm trạng của con người trước thiên nhiên đẹp nhưng buồn. Thiên nhiên mang một vẻ đẹp huyền bí giống như có những bí mật, và con người chính là người khơi dậy những bí mật đó...

2. Demo theme:

3. Code theme:

#asb-uh, #asb-nav, #asb-nav-logo {background-color:transparent;border:0px;}

#w-profile-img-root{background:url(http://i1049.photobucket.com/albums/s394/rolling_sad/Theme%20Yahooblog/Avatar-1.png) center no-repeat;height:304px;}

#w-profile-img-ctn img{height:0px;width:0px;}

#widget-recentVisitor .bd li {margin:0 5px;}

#widget-recentComment li, #widget-category li, #widget-recentPost .bd ul li {margin-left:2px;list-style:none;padding:5px 0px 5px 15px;border-bottom:1px dashed #000000;background:transparent url(http://nn0.upanh.com/b3.s28.d2/44b9e3b039a1a398a71f8862c3ab5b3c_46355150.62.png) no-repeat left;}

#widget-category li a{padding-left:0px!important;}

#widget-recentComment li a, #widget-category li a{font-family:bree;color:#000000;}

#widget-category li:hover a{color:#F33;font-family:bree;}

#widget-recentComment li:hover, #widget-category li:hover{background:#fff url(http://nn8.upanh.com/b3.s28.d1/b4b58127bb2d4fd8ccb85dea3176e604_46355148.61.png) no-repeat left;opacity:.5;}#widget-recentPost .bd ul li:hover{background:#fff url(http://nn8.upanh.com/b3.s28.d1/b4b58127bb2d4fd8ccb85dea3176e604_46355148.61.png) no-repeat left;opacity:.5;}

#active-widgets .widget, #inactive-widgets .widget .bd, #inactive-widgets .widget{background:transparent!important;height:60px;padding:5px;width:190px;}

#active-widgets .sidebar {width:210px;}

#comment-form .fields .yut-btn{background:transparent url(http://i1049.photobucket.com/albums/s394/rolling_sad/Theme%20Yahooblog/Iconcomment.png) no-repeat center;height:44px;width:77px;border:0px;}

#asb-header-ctn img{height:0px;width:0px;}

#hd {margin-bottom:0px;border-bottom:0px solid white;background:transparent url(http://i1049.photobucket.com/albums/s394/rolling_sad/Theme%20Yahooblog/Copy3ofUntitled-1-2.png) repeat-y center bottom;height:571px;}

#bd {background:transparent url(http://i1049.photobucket.com/albums/s394/rolling_sad/Theme%20Yahooblog/Copy2ofUntitled-1-2.png) repeat-y center;}

#ft {background:transparent url(http://i1049.photobucket.com/albums/s394/rolling_sad/Theme%20Yahooblog/CopyofUntitled-1-3.png) no-repeat top center;height:622px;margin-top:0px;font-size:0px;border-top:0px;}

#article-listing .img-wrap {width:200px;float:left;height:200px;background:url(http://i.imgur.com/g8nEF.png) no-repeat center;}

#article-listing .img-wrap img{height:150px!important;width:150px!important;padding:21px 0px 0px 3px;}

#article-listing .article .summary {margin:10px 30px 0px 0px;color:#000000;width:360px;float:right;padding:25px 5px 0px 5px;background:url(http://i.imgur.com/UKqYi.png) no-repeat right top;}

#comment-form{background:url(http://i.imgur.com/NhQ3o.png) no-repeat;height:204px;}

#comment-list .comment-reply{background:url(http://i.imgur.com/I4xT8.png) no-repeat;height:143px;}

#w-profile-card .status{border:none;background:url(http://i.imgur.com/hra9D.png) no-repeat;height:130px;}

#article-listing .article {background:url(http://nn5.upanh.com/b4.s27.d2/6dc6631b2d4947837399d60c347dcefc_46356855.dsju.png) repeat-x center bottom;border-width:0px;}

#article-single .article-ft{background:url(http://nn4.upanh.com/b6.s27.d1/d5ed9a945967d64467f9865d5ac9c0dd_46357444.hapng01100023.png) no-repeat center;height:100px;}

#article-listing .img-wrap img {max-width:100%!important;}

#article-listing .article .meta {width:300px;float:right;position:absolute;top:50px;left:250px;}

#article-listing .article .meta span {padding:0px 5px;}

#article-listing .article{position:relative;}

#article-listing .first-of-type .summary {margin:15px 30px 0px 0px!important;}

#article-listing .first-of-type .meta {top:40px!important;}

#article-single .bd{padding-top:40px;}

#article-supplement .yui-nav{visibility:hidden;}

#article-supplement.new-style-supplement{border-bottom:0px;}

#widget-externalSource .hd {display:none;}#search-result-info,

#article-listing-toggle, #widget-calendar .bd, #widget-recentVisitor .bd,

#widget-statistic .bd, #widget-calendar .bd, #widget-tag .bd, #widget-category

.bd, #widget-recentComment .bd, #widget-recentPost .bd {background:transparent;border:none;}#widget-calendar

.hd, #widget-recentVisitor .hd, #widget-statistic .hd, #widget-calendar .hd,

#widget-tag .hd, #widget-category .hd, #widget-recentComment .hd, #widget-recentPost

.hd {height:70px;}.sidebar {background:transparent;border:none;}

#yui-gen7, #yui-gen6, #yui-gen*, #ft ul {display:none;}.yui-t6 .yui-b.yui-t6 #yui-main .yui-b , #yui-main , #pagination-bottom, .yui-b #sidebar2, .widget {border:none !important;}a, a:visited, a:hover {color:#000000;}#article-navigation, #article-single, #article-supplement {background:transparent url(http://files.myopera.com/phuongleblog/ABlogyahoo/trong-suot-png.png);border:none;}

#asb-header #asb-header-ctn img {display:none;}

#asb-menu li,

#asb-menu li.current,

#asb-menu li.current a,

#asb-menu li a {background:transparent url(http://files.myopera.com/phuongleblog/ABlogyahoo/trong-suot-png.png);border:none;}

#article-single, #comment-form-wrapper, #article-supplement .yui-content , #comment-textarea, #article-single, #article-supplement {background:transparent;}

#article-listing {background:transparent!important;}.article-listing-ft {background:transparent;}#article-list {background:transparent;border:none !important;}#article-list.display-compact .img-wrap , #emotion-carousel {background:transparent;border:none !important;}

#pagination-bottom{background:transparent;}

#asb-menu li{text-transform:capitalize;}

#widget-recentPost h3, #widget-category h3, #widget-statistic h3, #widget-calendar h3, #widget-recentVisitor h3, #widget-followinglist h3, #widget-externalSource h3 {text-transform:capitalize;text-align:center;font-size:13px;}

#article-top-nav{display:none;}

#article-bottom-nav{display:none;}

.divider{display:none;}

#w-profile-card .status .text{color:#FFFFFF;}

#widget-recentPost h3, #widget-recentVisitor h3, #widget-recentComment h3, #widget-category h3, #widget-statistic h3, #widget-calendar h3, #widget-photoslide h3, #widget-following h3, #widget-calendar h3 {font-size:0px;border:0px;}

#widget-category .hd{background:url(http://i.imgur.com/4vwsx.png) no-repeat right bottom;height:50px;}#widget-recentPost .hd{background:url(http://i.imgur.com/geDRb.png) no-repeat right bottom;height:50px;}#widget-statistic .hd{background:url(http://i.imgur.com/mAPkl.png) no-repeat right bottom;height:50px;}#widget-recentVisitor .hd{background:url(http://i.imgur.com/85t1L.png) no-repeat right bottom;height:50px;}#widget-calendar .hd{background:url(http://i.imgur.com/MQDOw.png) no-repeat right bottom;height:50px;}#widget-photoslide .hd{background:url(http://i.imgur.com/Ac85a.png) no-repeat right bottom;height:50px;}#widget-recentComment .hd{background:url(http://i.imgur.com/sFouD.png) no-repeat right bottom;height:50px;}w-profile-hd{background:url(http://i.imgur.com/MUMC6.png) no-repeat right bottom;height:50px;}

.sidebar{background:transparent;border:0px;}#widget{}

</style>

Blog Minji