2016-12-24 42 views
0

我想在github上託管一個css文件,但它不工作..我該怎麼辦? ,我想主辦的CSS是在這裏和CSS文件的路徑是這樣的:加載託管的CSS文件

<link href='https://cdn.rawgit.com/username/github.io/gh-pages/mytemplate.css' rel='stylesheet' type='text/css' /> 

請看看,這裏的CSS文件的內容:

**<style type='text/css'> 
/*===================================== CSS Social Icons =====================================*/ 
.topbar-wrapper {background:#fff;position:relative;z-index:96;overflow:hidden;margin:0 auto;padding:10px;border-bottom: 1px solid rgb(223, 223, 223);} 
.top-wrappers {padding:0;position:static;max-width:1050px;margin:0 auto;} 
.header2 {margin:0 auto;padding:0} 
.top-gridnav {display:block;margin:0 auto;float:left;padding:0;width:100%;background:transparent;border:none;} 
.top-gridnav ul {width:100%;padding:0;margin:0;text-align:left;} 
.top-gridnav li {list-style-type:none;float:left;padding:0;margin:0;} 
.top-gridnav li a {position:relative;font-family: &#39;Montserrat&#39;, sans-serif;font-size:20px;font-weight:400;background-color:transparent;color:#7f939d;display:block;margin:0;padding-left:5px;line-height:100%;transition:color 0.3s;} 
.top-gridnav ul li a:active, .top-gridnav ul li.highlight a {line-height:100%;text-decoration:none;} 
.top-gridnav ul li a:hover {color:#F7F7F7;text-decoration:none;} 
.top-gridnav li.social-ico {float:right;} 
.top-gridnav li.social-ico a i{text-align:center;color:#FFFFFF;transition:initial; padding: 6px;} 
.top-gridnav li.social-ico a:hover,.top-gridnav li.social-ico a:hover i{color:#F7F7F7;} 
.top-gridnav a#pull {display:none;} 
.fa-linkedin {background: #007bb6;} 
.fa-pinterest {background: #cb2027;} 
.fa-google-plus {background: #dd4b39;} 
.fa-youtube {background: #e32c26;} 
.fa-twitter {background: #00aced;} 
.fa-facebook {background: #3b5998;} 
.fa fa-github {background: #000;} 

/*========================== CSS Breaking News ==========================*/ 
#breakingnews {margin-right:12px;height:30px;line-height:30px;overflow:hidden;width:40%;float:left;} 
#adbreakingnews li a {font-family:inherit;font-weight:400;color:#0000A0;transition:all 0.5s ease-in-out; font-family: &#39;Roboto&#39;, sans-serif;font-size:13px;padding:6px} 
#adbreakingnews li a:hover {color:#EE8F04;} 
#adbreakingnews {float:left;margin-left:90px;} 
#adbreakingnews ul,#adbreakingnews li{list-style:none;margin:0;padding:0} 

/*========================== CSS Search Form ==========================*/ 
#search {position:relative;font-size:14px;font-family: &#39;Roboto&#39;, sans-serif;width:auto;height:100%;margin:0 auto;text-align:center;padding-left: 50px;} 
#search-form {float: left;margin:0 auto;background:#F7F6F6 url(&#39;http://4.bp.blogspot.com/-tNR4-OGVxss/U8mnN-TwEbI/AAAAAAAAEeU/LhDqJKDl2ZQ/s1600/search.png&#39;) 96% 50% no-repeat;border:0 none;height:33px;line-height:13px;width:278px;font-family: &#39;Roboto&#39;, sans-serif;font-size:14px;font-weight:400;color:#737373;padding:0 10px;opacity:0.9;transition:all 0.5s ease 0s;} 
#search-form .search-button,#search-form .search-button:hover{transition:all 0.5s ease 0s;height:36px;width:36px;line-height:13px;background:#fff;border:0 none;float:right;cursor:pointer;outline:none;} 
#search-form:hover{background:#fff url(&#39;http://2.bp.blogspot.com/-rRYRHBpaPKo/U8aAIU6MgdI/AAAAAAAAEZQ/8xL3jXykKQU/s1600/search.png&#39;) 90% 50% no-repeat;color:#888;} 
#search-form:focus{background:#fff url(&#39;http://2.bp.blogspot.com/-rRYRHBpaPKo/U8aAIU6MgdI/AAAAAAAAEZQ/8xL3jXykKQU/s1600/search.png&#39;) -10% 50% no-repeat;text-shadow:none!important;outline:none;color:#666;} 
#box {display:none} 
.search-text {font-size:14px;font-family: &#39;Roboto&#39;, sans-serif;float:right;cursor:pointer;} 
.search-text:hover {color:#fff} 

/*===================================== CSS Outer Wrapper =====================================*/ 
.top-header {background:#fff;padding:20px;} 
#outer-wrapper {background:#E9EAED;max-width:1100px;overflow:hidden;margin:auto;margin-top: 10px;border: 1px solid rgba(181, 181, 181, 0.44)} 
#banner {margin-bottom: 20px; background: #fff; border: 1px solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; text-align: center; padding: 10px; margin: 15px;} 

/*===================================== CSS Post Wrapper =====================================*/ 
#post-wrapper {background:transparent;color:#444;float:left;width:68%;margin:0 0 10px;padding-left: 15px;} 
.post-inner {padding:0;} 
.post {background:#fff;margin:0 0 15px;padding:0;border: 1px solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5;} 
.post-body {font-family: &#39;Roboto&#39;, sans-serif;line-height:1.6em;color:#444;margin-right:0;font-size:15px;} 
.post-body img {max-width:95%;margin:0 auto;height:auto;} 
h3.post-title, h2.post-title, h1.post-title {font-family: &#39;Righteous&#39;, cursive;font-size:22px;font-weight:400;margin-bottom:20px} 
h3.post-title a, h2.post-title a, h1.post-title a, h2.post-title, h1.post-title {color:#666;} 
h3.post-title a:hover, h2.post-title a:hover, h1.post-title a:hover {color:#f56954!important;} 
.post-info {background:transparent;margin-top:5px;margin-bottom:5px;color:#fff;font-size:12px;text-align:left;padding:0;box-shadow:none;} 
.post-info a {display:inline;background:transparent;color:#828282;padding:4px 6px 4px 6px;transition:all .3s ease-out;} 
.post-info a:hover {color:#f56954;} 
.author-info, .time-info, .label-info, .comment-info {display:inline;color:#828282;} 
.timestamp-link abbr {border-bottom:none;} 
span.post-author.vcard {visibility:hidden;width:0;height:0;} 
.post-header, .post-footer {line-height:initial;width:0;height:0;} 

/*=====================================CSS Recent Comments ==================================*/ 
ul.ms_recent{list-style:none;margin:0;padding:0;} 
.ms_recent li{background:transparent;margin:0 0 6px!important;padding:3px 
!important;display:block;clear:both;overflow:hidden;list-style:none; border: 1px solid transparent; 
border-radius:9px; max-height: 100px;} 
.ms_recent li:hover{background:#fff;border: 1px solid #e9e9e9;} 
.ms_recent a {text-decoration:none;} 
.avatarImage{padding:3px;background:#fefefe;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;} 
.avatarRound{border-radius:100px;width:35px;height:35px} 
.ms_recent li span{margin-top:4px;color: #444;display: block;font-size: 12px;line-height: 1.4;} 

/*===================================== CSS Popular Posts =====================================*/ 
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a, 
.PopularPosts li a img {margin:0;padding:0;list-style:none;border:none; 
background:none;outline:none;} 
.PopularPosts ul {margin:0;list-style:none;color:#333;} 
.PopularPosts ul li img {display:block;margin-right:10px;padding:2px;width:100px;height:85px;float:left;transition:all 0.3s ease-out;border: 1px solid #d6d6d6;margin-left:5px} 
.PopularPosts ul li img:hover {opacity: 0.7;-webkit-transform: scale3d(1.05,1.05,1);transform: scale3d(1.05,1.05,1);;} 
.PopularPosts ul li {background-color:#fff;margin:2px;padding:0;position:relative;transition:all 0.3s ease-out; border-bottom: 1px solid rgb(239, 239, 239);} 
.PopularPosts ul li:first-child {border-top:none;} 
.PopularPosts ul li:last-child {border-bottom:none;} 
.PopularPosts ul li a:hover {color:#f56954!important;} 
.PopularPosts ul li .item-title a, .PopularPosts ul li a {color:#333;text-decoration:none;font-size:12px;font-weight:700;transition:all 0.3s ease-out;} 
.PopularPosts ul li .item-title a:hover, .PopularPosts ul li a:hover {color:#2D3E52} 
.PopularPosts ul li:before {display:none;list-style:none;} 
.PopularPosts ul li:first-child &gt; a:before {content:&quot;hot&quot;;font-size:10px;font-weight:400;padding:0 4px;border-radius:2px;color:#fff;background:#f56954;display:inline-block;position:absolute;right:0;top:0;} 
.PopularPosts .item-thumbnail {margin:0 0 0 0;} 
.PopularPosts .item-snippet {font-size:13px;color:#333;font-weight:400;} 
.profile-img{display:inline;opacity:1;margin:0 6px 3px 0;} 
.PopularPosts .item-title {padding-bottom:.2em;padding:0 5px;} 


/*===================================== CSS Footer Wrapper =====================================*/ 
#footer-wrapper {text-align:left;overflow:hidden;padding:15px 0 0 0;margin-top:20px;background-color:#E9EAED;} 
#footer-wrapper .widget-content a {color:#fff} 
#footer-widgetfix .footer-widget {width:30.2%;float:left;margin-left:20px;padding-top:10px;padding-bottom:15px;} 
#footer-widgetfix {max-width:1100px;overflow:hidden;margin:0 auto;} 
#footer-wrapper h2 {font-family: &#39;Roboto&#39;, sans-serif;font-size:16px;font-weight:700;color:#f9f9f9;padding:10px 0;text-transform:uppercase;display:block;border-bottom: 3px solid #243242;} 
#footer-wrapper .widget-content {text-align:left;font-family: &#39;Roboto&#39;, sans-serif;color:#f9f9f9;} 
#footer-wrapper .widget-content li {margin-left:-14px;color:#f9f9f9} 
#footer-wrapper .widget li {margin:5px 0 0 0;padding:5px 2px 0 0;display:inline-block;} 
.footer li a {padding-top:0;padding-right:0;font-size:14px; 
font-weight:400;font-family: &#39;Roboto&#39;, sans-serif;color:#f9f9f9;margin:0} 
.footer li a:hover {color:#fff;} 
#footerfix {overflow:hidden;padding:12px 5px;margin:15px 0 0 0; background-color:#576269;} 
.copyleft {float:left;margin:10px;color:#fff;font-size:12px;font-family: &#39;Roboto&#39;, sans-serif;} 
#copyright {float:right;color:#fff;font-size:13px;font-family: &#39;Roboto&#39;, sans-serif;margin-right:30px} 
.copyleft a,#copyright a {color:#fff;text-decoration:none;} 
.copyleft a:hover,#copyright a:hover {color:#a94334;text-decoration:none;} 
.quickedit{display:none;visibility:hidden} 
#ArchiveList a.post-count-link, #ArchiveList a.post-count-link:link, #ArchiveList a.post-count-link:visited {text-decoration:none;font-size:13px;font-weight:700;font-family: &#39;Montserrat&#39;, sans-serif;} 
span.post-count {font-size:11px;font-weight:700;} 
.BlogArchive #ArchiveList ul.posts li {font-size:12px;} 
#ArchiveList {padding: 10px;} 
#ArchiveList select {width: 100%;padding: 15px;margin-bottom: 5px; font-family: &#39;Montserrat&#39;, sans-serif;border: 3px solid rgba(201, 201, 201, 0.52);font-size:13px;} 

@media screen and (max-width:1066px) { 
#outer-wrapper {margin:0 auto;} 
.header-right {float:right;padding:0;overflow:hidden;margin:0;max-width:640px!important;} 
.header-right img {display:block;} 
.cd-main-header {height:100px} 
#header {max-width: 300px;} 
#search-form {width:250px;} 
#recent1 .recent-box {width:49.2%} 
.share-post{display:none;}} 


@media screen and (max-width:960px) { 
#outer-wrapper {margin:0 auto;border:none;box-shadow:none;} 
#header h1,#header p,#header,.header-right,#header .description{top: -31px;width:100%;float:left;text-align:center;} 
#header {margin:20px auto;padding:0 30px;} 
.header-right img, .header-right iframe{margin:0 auto;max-width:100%;} 
#header-wrapper{padding:0 10px;} 
.header-wrapper2 {padding:0} 
#footer-widgetfix {width:100%;overflow:hidden;} 
#footer-widgetfix .footer-widget {width:46%;float:left;margin-left:20px;} 
#header-inner {left:0;right:0;}} 

@media only screen and (max-width:768px){ 
#post-wrapper, #sidebar-wrapper,#footer-col1,#footer-col2,#footer-col3 {width:100%;max-width:100%;padding-left:0;} 
#header {background:none;} 
.post-body img {max-width:90%;} 
.post-image {margin:0 10px 0 0;} 
.sidebar-inner, .post-inner {padding:15px 0 0px;} 
.copyleft,#copyright {float:none;text-align:center;margin:10px auto;} 
#recent1 .recent-box{width:49%} 
#search-form{float:none;margin-bottom:5px}} 


@media only screen and (max-width:640px){ 
#header h1,#header p,#header,.header-right,#header .description{width:100%;float:left;text-align:center;} 
.header-right{float:none;margin:0 auto;text-align:center;} 
.header-right img, .header-right iframe{float:none;margin:0 auto;text-align:center;} 
#header-wrapper{padding:0;margin:20px 0 0 0;min-height:150px;} 
#header {min-width:initial;background:none;margin:20px auto;padding:0 5px;} 
#header-inner {top:25%;} 
#header .description {font-size:100%;line-height:1.5;margin-left:0} 
#footer-widgetfix {width:100%;overflow:hidden;} 
#footer-widgetfix .footer-widget {width:92%;float:left;margin-left:20px;} 
.pagenav .pages, #breakingnews {display:none;} 
#search{padding-left:0} 
#label_with_thumbs li {padding:10px} 
#recent1 .recent-box {width:49%} 
.post-image img {width:200px!important; height:150px!important;} 
h2.post-title, h1.post-title {font-size:15px!important;} 
.post-info {font-size:8px!important}} 


@media only screen and (max-width:480px){ 
#outer-wrapper {margin:0 auto;} 
.header-right{float:none;margin:0 auto;text-align:center;} 
.header-right img, .header-right iframe{float:none;margin:0 auto;text-align:center;} 
.post {margin:0 0 8px;padding:8px;} 
.post-image {margin-bottom:5px} 
.post-image img {width:100%!important; height:150px!important;} 
h2.post-title a, h1.post-title a, h2.post-title, h1.post-title {font-size:18px;padding:5px;clear:both;} 
.comments .comment-block, .comments .comments-content .inline-thread { 
padding:10px !important;} 
.comment .comment-thread.inline-thread .comment {margin: 0 0 0 0 !important;} 
#comments .click-comment{display:none;} 
#related_posts {padding:0;} 
.post-info {font-size:12px;display:none!important} 
#feedContainer li {width:100%;} 
.authorLeft{float:none;width:120px;margin:0 auto} 
.authorDetails{text-align:center} 
.authorDetails h2{float:none} 
.authorDetails span{float:none} 
.articleAuthor .authorContent p{text-align:center} 
.topbar-wrapper, .share-post, #related_posts p {display:none;} 
#recent1 .recent-box {width:100%;margin-bottom:10px} 
ul#relpost_img_sum li, .pager-right, .pager-left {width:100%}} 

@media screen and (max-width:320px){ 
.header-right{float:none;margin:0 auto;text-align:center;} 
.header-right img, .header-right iframe{float:none;margin:0 auto;text-align:center;} 
.post {padding:6px;}} 
/* Code Box ----------------------------------------------- */ 
.code { background:pink; background-repeat:no-repeat; border: solid #5C7B90;border-radius:10px;box-shadow:0px 0px 13px #219DFC; border-width: 1px 1px 1px 25px; color: black; font: 13px &#39;Courier New&#39;, Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; max-height: 200px; min-height: 16px; overflow: auto; padding: 10px 10px 10px; width: 90%; } .code:hover { background: #F08080; background-repeat:no-repeat; } 
#Gadget1{display: none !important;} 

pre.source-code { background:pink; background-repeat:no-repeat; border: solid #5C7B90; border-width: 5px 1px 1px 25px; color: black; font: 13px &#39;Courier New&#39;, Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; max-height: 200px; min-height: 16px; overflow: auto; padding: 10px 10px 10px; width: 90%; } .code:hover { background: #F08080; background-repeat:no-repeat; } 
</style>** 

有誰請提供一些信息與實際例子?我將非常感謝

+0

這是一個通用名的一般鏈接 - 它會給你一個404:找不到。 - 檢查你的路徑,然後調整鏈接。發佈html也 – 2016-12-24 09:18:10

+0

我認爲css路徑不正確,迴應未找到。 –

+0

現在你的路徑正常工作並返回css文件。 –

回答

0

CSS文件不應包含任何HTML標記。從文件中刪除樣式標籤<style type='text/css'></style>

-1

更新了測試的解決方案

我認爲你必須使用谷歌提供的標籤<b:skin>

因此,這將normaly是這樣的:

<b:skin> 
    <![CDATA[/ 
     your css here 
    ]]> 
</b:skin> 

[更新1]

我不知道,如果谷歌是合理的情況下,但首先我認爲你有一個錯字。和我一起復制/粘貼發現,你在這是在評論中輸入:

<link href='cdn.rawgit.com/knigulper/github.io/gh-pages/mytemplate‌​.css'; rel='stylesheet' type='text/css'/> 

一般應與雙引號,而不是與;...mytemplate.css'

<link rel="stylesheet" type="text/css" href="cdn.rawgit.com/knigulper/github.io/gh-pages/mytemplate‌​.css" /> 

[更新2 ]

首先感謝那些誰給了我我的第一個! 所以重新開始工作......我嘗試了一個新的博客。

我使用谷歌的'簡單'模板來創建博客。 它的工作,但ONLY如果你已經有了類和id目前在body

證明:Proof of actions

結果的<b:skin>

<b:skin><![CDATA[/* 
----------------------------------------------- 
Blogger Template Style 
Name:  Simple 
Designer: Josh Peterson 
URL:  www.noaesthetic.com 
----------------------------------------------- */ 
/* 
I deleted the template base skin just to avoid characters limit of stackoverflow */ 

/*===================================== CSS Social Icons =====================================*/ 
.topbar-wrapper {background:#fff;position:relative;z-index:96;overflow:hidden;margin:0 auto;padding:10px;border-bottom: 1px solid rgb(223, 223, 223);} 
.top-wrappers {padding:0;position:static;max-width:1050px;margin:0 auto;} 
.header2 {margin:0 auto;padding:0} 
.top-gridnav {display:block;margin:0 auto;float:left;padding:0;width:100%;background:transparent;border:none;} 
.top-gridnav ul {width:100%;padding:0;margin:0;text-align:left;} 
.top-gridnav li {list-style-type:none;float:left;padding:0;margin:0;} 
.top-gridnav li a {position:relative;font-family: &#39;Montserrat&#39;, sans-serif;font-size:20px;font-weight:400;background-color:transparent;color:#7f939d;display:block;margin:0;padding-left:5px;line-height:100%;transition:color 0.3s;} 
.top-gridnav ul li a:active, .top-gridnav ul li.highlight a {line-height:100%;text-decoration:none;} 
.top-gridnav ul li a:hover {color:#F7F7F7;text-decoration:none;} 
.top-gridnav li.social-ico {float:right;} 
.top-gridnav li.social-ico a i{text-align:center;color:#FFFFFF;transition:initial; padding: 6px;} 
.top-gridnav li.social-ico a:hover,.top-gridnav li.social-ico a:hover i{color:#F7F7F7;} 
.top-gridnav a#pull {display:none;} 
.fa-linkedin {background: #007bb6;} 
.fa-pinterest {background: #cb2027;} 
.fa-google-plus {background: #dd4b39;} 
.fa-youtube {background: #e32c26;} 
.fa-twitter {background: #00aced;} 
.fa-facebook {background: #3b5998;} 
.fa fa-github {background: #000;} 
/*========================== CSS Breaking News ==========================*/ 
#breakingnews {margin-right:12px;height:30px;line-height:30px;overflow:hidden;width:40%;float:left;} 
#adbreakingnews li a {font-family:inherit;font-weight:400;color:#0000A0;transition:all 0.5s ease-in-out; font-family: &#39;Roboto&#39;, sans-serif;font-size:13px;padding:6px} 
#adbreakingnews li a:hover {color:#EE8F04;} 
#adbreakingnews {float:left;margin-left:90px;} 
#adbreakingnews ul,#adbreakingnews li{list-style:none;margin:0;padding:0} 
/*========================== CSS Search Form ==========================*/ 
#search {position:relative;font-size:14px;font-family: &#39;Roboto&#39;, sans-serif;width:auto;height:100%;margin:0 auto;text-align:center;padding-left: 50px;} 
#search-form {float: left;margin:0 auto;background:#F7F6F6 url(&#39;http://4.bp.blogspot.com/-tNR4-OGVxss/U8mnN-TwEbI/AAAAAAAAEeU/LhDqJKDl2ZQ/s1600/search.png&#39;) 96% 50% no-repeat;border:0 none;height:33px;line-height:13px;width:278px;font-family: &#39;Roboto&#39;, sans-serif;font-size:14px;font-weight:400;color:#737373;padding:0 10px;opacity:0.9;transition:all 0.5s ease 0s;} 
#search-form .search-button,#search-form .search-button:hover{transition:all 0.5s ease 0s;height:36px;width:36px;line-height:13px;background:#fff;border:0 none;float:right;cursor:pointer;outline:none;} 
#search-form:hover{background:#fff url(&#39;http://2.bp.blogspot.com/-rRYRHBpaPKo/U8aAIU6MgdI/AAAAAAAAEZQ/8xL3jXykKQU/s1600/search.png&#39;) 90% 50% no-repeat;color:#888;} 
#search-form:focus{background:#fff url(&#39;http://2.bp.blogspot.com/-rRYRHBpaPKo/U8aAIU6MgdI/AAAAAAAAEZQ/8xL3jXykKQU/s1600/search.png&#39;) -10% 50% no-repeat;text-shadow:none!important;outline:none;color:#666;} 
#box {display:none} 
.search-text {font-size:14px;font-family: &#39;Roboto&#39;, sans-serif;float:right;cursor:pointer;} 
.search-text:hover {color:#fff} 
/*===================================== CSS Outer Wrapper =====================================*/ 
.top-header {background:#fff;padding:20px;} 
#outer-wrapper {background:#E9EAED;max-width:1100px;overflow:hidden;margin:auto;margin-top: 10px;border: 1px solid rgba(181, 181, 181, 0.44)} 
#banner {margin-bottom: 20px; background: #fff; border: 1px solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5; text-align: center; padding: 10px; margin: 15px;} 
/*===================================== CSS Post Wrapper =====================================*/ 
#post-wrapper {background:transparent;color:#444;float:left;width:68%;margin:0 0 10px;padding-left: 15px;} 
.post-inner {padding:0;} 
.post {background:#fff;margin:0 0 15px;padding:0;border: 1px solid; border-color: #e5e6e9 #dfe0e4 #d0d1d5;} 
.post-body {font-family: &#39;Roboto&#39;, sans-serif;line-height:1.6em;color:#444;margin-right:0;font-size:15px;} 
.post-body img {max-width:95%;margin:0 auto;height:auto;} 
h3.post-title, h2.post-title, h1.post-title {font-family: &#39;Righteous&#39;, cursive;font-size:22px;font-weight:400;margin-bottom:20px} 
h3.post-title a, h2.post-title a, h1.post-title a, h2.post-title, h1.post-title {color:#666;} 
h3.post-title a:hover, h2.post-title a:hover, h1.post-title a:hover {color:#f56954!important;} 
.post-info {background:transparent;margin-top:5px;margin-bottom:5px;color:#fff;font-size:12px;text-align:left;padding:0;box-shadow:none;} 
.post-info a {display:inline;background:transparent;color:#828282;padding:4px 6px 4px 6px;transition:all .3s ease-out;} 
.post-info a:hover {color:#f56954;} 
.author-info, .time-info, .label-info, .comment-info {display:inline;color:#828282;} 
.timestamp-link abbr {border-bottom:none;} 
span.post-author.vcard {visibility:hidden;width:0;height:0;} 
.post-header, .post-footer {line-height:initial;width:0;height:0;} 
/*=====================================CSS Recent Comments ==================================*/ 
ul.ms_recent{list-style:none;margin:0;padding:0;} 
.ms_recent li{background:transparent;margin:0 0 6px!important;padding:3px 
!important;display:block;clear:both;overflow:hidden;list-style:none; border: 1px solid transparent; 
border-radius:9px; max-height: 100px;} 
.ms_recent li:hover{background:#fff;border: 1px solid #e9e9e9;} 
.ms_recent a {text-decoration:none;} 
.avatarImage{padding:3px;background:#fefefe;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;} 
.avatarRound{border-radius:100px;width:35px;height:35px} 
.ms_recent li span{margin-top:4px;color: #444;display: block;font-size: 12px;line-height: 1.4;} 
/*===================================== CSS Popular Posts =====================================*/ 
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a, 
.PopularPosts li a img {margin:0;padding:0;list-style:none;border:none; 
background:none;outline:none;} 
.PopularPosts ul {margin:0;list-style:none;color:#333;} 
.PopularPosts ul li img {display:block;margin-right:10px;padding:2px;width:100px;height:85px;float:left;transition:all 0.3s ease-out;border: 1px solid #d6d6d6;margin-left:5px} 
.PopularPosts ul li img:hover {opacity: 0.7;-webkit-transform: scale3d(1.05,1.05,1);transform: scale3d(1.05,1.05,1);;} 
.PopularPosts ul li {background-color:#fff;margin:2px;padding:0;position:relative;transition:all 0.3s ease-out; border-bottom: 1px solid rgb(239, 239, 239);} 
.PopularPosts ul li:first-child {border-top:none;} 
.PopularPosts ul li:last-child {border-bottom:none;} 
.PopularPosts ul li a:hover {color:#f56954!important;} 
.PopularPosts ul li .item-title a, .PopularPosts ul li a {color:#333;text-decoration:none;font-size:12px;font-weight:700;transition:all 0.3s ease-out;} 
.PopularPosts ul li .item-title a:hover, .PopularPosts ul li a:hover {color:#2D3E52} 
.PopularPosts ul li:before {display:none;list-style:none;} 
.PopularPosts ul li:first-child &gt; a:before {content:&quot;hot&quot;;font-size:10px;font-weight:400;padding:0 4px;border-radius:2px;color:#fff;background:#f56954;display:inline-block;position:absolute;right:0;top:0;} 
.PopularPosts .item-thumbnail {margin:0 0 0 0;} 
.PopularPosts .item-snippet {font-size:13px;color:#333;font-weight:400;} 
.profile-img{display:inline;opacity:1;margin:0 6px 3px 0;} 
.PopularPosts .item-title {padding-bottom:.2em;padding:0 5px;} 
/*===================================== CSS Footer Wrapper =====================================*/ 
#footer-wrapper {text-align:left;overflow:hidden;padding:15px 0 0 0;margin-top:20px;background-color:#E9EAED;} 
#footer-wrapper .widget-content a {color:#fff} 
#footer-widgetfix .footer-widget {width:30.2%;float:left;margin-left:20px;padding-top:10px;padding-bottom:15px;} 
#footer-widgetfix {max-width:1100px;overflow:hidden;margin:0 auto;} 
#footer-wrapper h2 {font-family: &#39;Roboto&#39;, sans-serif;font-size:16px;font-weight:700;color:#f9f9f9;padding:10px 0;text-transform:uppercase;display:block;border-bottom: 3px solid #243242;} 
#footer-wrapper .widget-content {text-align:left;font-family: &#39;Roboto&#39;, sans-serif;color:#f9f9f9;} 
#footer-wrapper .widget-content li {margin-left:-14px;color:#f9f9f9} 
#footer-wrapper .widget li {margin:5px 0 0 0;padding:5px 2px 0 0;display:inline-block;} 
.footer li a {padding-top:0;padding-right:0;font-size:14px; 
font-weight:400;font-family: &#39;Roboto&#39;, sans-serif;color:#f9f9f9;margin:0} 
.footer li a:hover {color:#fff;} 
#footerfix {overflow:hidden;padding:12px 5px;margin:15px 0 0 0; background-color:#576269;} 
.copyleft {float:left;margin:10px;color:#fff;font-size:12px;font-family: &#39;Roboto&#39;, sans-serif;} 
#copyright {float:right;color:#fff;font-size:13px;font-family: &#39;Roboto&#39;, sans-serif;margin-right:30px} 
.copyleft a,#copyright a {color:#fff;text-decoration:none;} 
.copyleft a:hover,#copyright a:hover {color:#a94334;text-decoration:none;} 
.quickedit{display:none;visibility:hidden} 
#ArchiveList a.post-count-link, #ArchiveList a.post-count-link:link, #ArchiveList a.post-count-link:visited {text-decoration:none;font-size:13px;font-weight:700;font-family: &#39;Montserrat&#39;, sans-serif;} 
span.post-count {font-size:11px;font-weight:700;} 
.BlogArchive #ArchiveList ul.posts li {font-size:12px;} 
#ArchiveList {padding: 10px;} 
#ArchiveList select {width: 100%;padding: 15px;margin-bottom: 5px; font-family: &#39;Montserrat&#39;, sans-serif;border: 3px solid rgba(201, 201, 201, 0.52);font-size:13px;} 
@media screen and (max-width:1066px) { 
#outer-wrapper {margin:0 auto;} 
.header-right {float:right;padding:0;overflow:hidden;margin:0;max-width:640px!important;} 
.header-right img {display:block;} 
.cd-main-header {height:100px} 
#header {max-width: 300px;} 
#search-form {width:250px;} 
#recent1 .recent-box {width:49.2%} 
.share-post{display:none;}} 
@media screen and (max-width:960px) { 
#outer-wrapper {margin:0 auto;border:none;box-shadow:none;} 
#header h1,#header p,#header,.header-right,#header .description{top: -31px;width:100%;float:left;text-align:center;} 
#header {margin:20px auto;padding:0 30px;} 
.header-right img, .header-right iframe{margin:0 auto;max-width:100%;} 
#header-wrapper{padding:0 10px;} 
.header-wrapper2 {padding:0} 
#footer-widgetfix {width:100%;overflow:hidden;} 
#footer-widgetfix .footer-widget {width:46%;float:left;margin-left:20px;} 
#header-inner {left:0;right:0;}} 
@media only screen and (max-width:768px){ 
#post-wrapper, #sidebar-wrapper,#footer-col1,#footer-col2,#footer-col3 {width:100%;max-width:100%;padding-left:0;} 
#header {background:none;} 
.post-body img {max-width:90%;} 
.post-image {margin:0 10px 0 0;} 
.sidebar-inner, .post-inner {padding:15px 0 0px;} 
.copyleft,#copyright {float:none;text-align:center;margin:10px auto;} 
#recent1 .recent-box{width:49%} 
#search-form{float:none;margin-bottom:5px}} 
@media only screen and (max-width:640px){ 
#header h1,#header p,#header,.header-right,#header .description{width:100%;float:left;text-align:center;} 
.header-right{float:none;margin:0 auto;text-align:center;} 
.header-right img, .header-right iframe{float:none;margin:0 auto;text-align:center;} 
#header-wrapper{padding:0;margin:20px 0 0 0;min-height:150px;} 
#header {min-width:initial;background:none;margin:20px auto;padding:0 5px;} 
#header-inner {top:25%;} 
#header .description {font-size:100%;line-height:1.5;margin-left:0} 
#footer-widgetfix {width:100%;overflow:hidden;} 
#footer-widgetfix .footer-widget {width:92%;float:left;margin-left:20px;} 
.pagenav .pages, #breakingnews {display:none;} 
#search{padding-left:0} 
#label_with_thumbs li {padding:10px} 
#recent1 .recent-box {width:49%} 
.post-image img {width:200px!important; height:150px!important;} 
h2.post-title, h1.post-title {font-size:15px!important;} 
.post-info {font-size:8px!important}} 
@media only screen and (max-width:480px){ 
#outer-wrapper {margin:0 auto;} 
.header-right{float:none;margin:0 auto;text-align:center;} 
.header-right img, .header-right iframe{float:none;margin:0 auto;text-align:center;} 
.post {margin:0 0 8px;padding:8px;} 
.post-image {margin-bottom:5px} 
.post-image img {width:100%!important; height:150px!important;} 
h2.post-title a, h1.post-title a, h2.post-title, h1.post-title {font-size:18px;padding:5px;clear:both;} 
.comments .comment-block, .comments .comments-content .inline-thread { 
padding:10px !important;} 
.comment .comment-thread.inline-thread .comment {margin: 0 0 0 0 !important;} 
#comments .click-comment{display:none;} 
#related_posts {padding:0;} 
.post-info {font-size:12px;display:none!important} 
#feedContainer li {width:100%;} 
.authorLeft{float:none;width:120px;margin:0 auto} 
.authorDetails{text-align:center} 
.authorDetails h2{float:none} 
.authorDetails span{float:none} 
.articleAuthor .authorContent p{text-align:center} 
.topbar-wrapper, .share-post, #related_posts p {display:none;} 
#recent1 .recent-box {width:100%;margin-bottom:10px} 
ul#relpost_img_sum li, .pager-right, .pager-left {width:100%}} 
@media screen and (max-width:320px){ 
.header-right{float:none;margin:0 auto;text-align:center;} 
.header-right img, .header-right iframe{float:none;margin:0 auto;text-align:center;} 
.post {padding:6px;}} 
/* Code Box ----------------------------------------------- */ 
.code { background:pink; background-repeat:no-repeat; border: solid #5C7B90;border-radius:10px;box-shadow:0px 0px 13px #219DFC; border-width: 1px 1px 1px 25px; color: black; font: 13px &#39;Courier New&#39;, Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; max-height: 200px; min-height: 16px; overflow: auto; padding: 10px 10px 10px; width: 90%; } .code:hover { background: #F08080; background-repeat:no-repeat; } 
#Gadget1{display: none !important;} 
pre.source-code { background:pink; background-repeat:no-repeat; border: solid #5C7B90; border-width: 5px 1px 1px 25px; color: black; font: 13px &#39;Courier New&#39;, Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; max-height: 200px; min-height: 16px; overflow: auto; padding: 10px 10px 10px; width: 90%; } .code:hover { background: #F08080; background-repeat:no-repeat; } 

]]></b:skin> 
+0

我試過但仍然不工作:( –

+0

我更新了我的答案@BhatFrooa;) – funilrys