更改Blogger页面的字体大小

时间:2014-06-26 10:14:32

标签: css fonts blogger

我博客页面上的字体大小明显小于常规博客帖子中的字体大小。这是一篇普通的博文,其中包含我想要的字体大小:http://thereadinggrotto.blogspot.sg/2014/06/first-post.html

以下是其中一个博客页面的字体大小:http://thereadinggrotto.blogspot.sg/p/about-mermaid.html

我想让我的网页上的字体更大。

我尝试调整变量值,但是当我更改' 11px'和#12; 12px'到15px,所有这一切都搞砸了我主页的字体大小,这不是我想要的。

当我调整它时搞砸主页的变量:

 <Variable name="bodyfont" description="Text Font"
         type="font" default="normal normal 11px Arial, Georgia, Serif" value="normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif">

我的博客文章的CSS(似乎不适用于博客页面):

/* =============================
Posts
============================= */
.post {
  margin:.5em 0 1.5em;
  border-bottom:1px solid #d3ebe1;
  padding-bottom:1.5em;
  font-family:'Cabin', sans-serif;
  color:#305e58;
}
.post h3 {
  margin:.25em 0 0;
  padding:0 0 4px;
  font-size:160%;
  line-height:1.4em;
  color:#305e58;
  font-family:Yanone Kaffeesatz;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
  display:block;
  text-decoration:none;
  color:#305e58;
  font-weight:400;
}
.post h3 strong, .post h3 a:hover {
  color:#09877d;
}
.post-body {
  margin:0 0 1.75em;
  line-height:160%;
  font:15px 'Cabin', sans-serif;
  color:#305e58;
}
.post-body blockquote {
  line-height:1.3em;
}
.post-footer {
  margin:.75em 0;
  color:#8ba69b;
  text-transform:uppercase;
  letter-spacing:0.2px;
  font:11px 'Cabin', sans-serif;
  line-height:1.4em;
}
.comment-link {
  margin-startside:.6em;
}
.post img {
  max-width:640px;
  height:auto;
}
.post table. tr-caption-container {
  padding-bottom:4px;
}
.tr-caption-container img {
  border:none;
  padding:0;
}
.post blockquote {
  margin:1em 20px;
  padding:2px 5px 2px 35px;
  font-style:normal;
  color:#305e58;
}
.post blockquote p {
  margin:.75em 0;
}

CSS的另一部分:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#outer-wrapper {
  width:960px
}
#main-wrapper {
  width:680px;
  margin:0 10px 0 0;
  border-left:1px solid #d3ebe1;
  padding-left:15px;
}
#post-header-top {
  border-bottom:1px solid #d3ebe1;
  margin-bottom:20px;
  padding-left:40px;
}
.date-post-top-wrapper {
  float:left;
  margin-right:10px;
}
.date-container {
  width:auto;
  height:auto;
  text-align:center;
  border-right:1px solid #d3ebe1;
  padding:0 20px 10px 0;
  margin-top:5px;
  text-transform:uppercase;
}
.post-date-day-name {
  font:300 25px Yanone Kaffeesatz;
  color: #305e58
}
.post-date-day-month-year {
  font:normal 10px Cabin;
  color:#305e58
}
.post h3 {
  margin:0 0 5px;
  font:300 33px Yanone Kaffeesatz;
  text-transform:uppercase;
  color:#305e58
}
.post-footer {
  padding:5px 10px;
  margin:0 0 5px;
  background:#d3ebe1;
  border:1px solid #d3ebe1;
  margin-left:40px;
}
.post {
  margin:0 0 1.5em;
  line-height:1.6em;
}
.post-body {
  margin:0 0 1.75em;
  font:15px Cabin, sans-serif;
  line-height:160%;
  margin-left:40px;
}
.post img {
  max-width:640px;
  height:auto;
}
.comments {
  margin-left:40px;
}
#blog-pager {
  margin-left:40px;
}
#related-posts {
  float:center;
  text-transform:none;
  height:100%;
  min-height:100%;
  padding-top:5px;
  margin-left:40px;
}
#related-posts h2 {
  color:#305e58;
  padding:5px;
  margin:0 0 10px;
  text-align:center;
  background:#edf7f2;
  border-top:1px solid #d3ebe1;
  font:300 17px Yanone Kaffeesatz;
}
#related-posts a {
  color:#305e58;
  overflow:hidden;
  display:block;
  width:80px;
 height:155px;
}
#related-posts a:hover {
  background:#d3ebe1;
  color:#8ba69b;
  overflow:hidden;
}
#related-posts a img {
  transition:.3s linear;
  -moz-transition:all .3s;
  -webkit-transition:.3s linear;
  box-shadow:none;
  padding:4px;
  padding-top:7px;
}
#related-posts a img:hover {
  transition:.3s linear;
  -moz-transition:all .3s;
  -webkit-transition:.3s linear;
  margin-bottom:5px;
}
#rptxt{
  padding-top:5px;
  width:68px;
  height:65px;
  margin:5px;
  border-top:1px solid #d3ebe1;
  font:300 13px Cabin, sans-serif;
  font-style:italic;
}
</style>

我为该字体添加了15px,但它在页面上仍然是12px。

1 个答案:

答案 0 :(得分:0)

更新我的答案,因为该解决方案对您不起作用。

您在问题中添加的CSS代码。用它来更新它。

/* =============================
Posts
============================= */
.post {
  margin:.5em 0 1.5em;
  border-bottom:1px solid #d3ebe1;
  padding-bottom:1.5em;
  font:normal 15px 'Cabin', sans-serif;
  color:#305e58;
}

你可以看到我更改了font属性。试试这个它应该有用。