Tuesday, February 7, 2012

inove主题,图片代替文字标题的方法

七月 9, 2009 by winston  
Filed under 淘宝之外


  关于iNove主题, 被问得最频繁的莫过于”怎样将博客的标题换成图片?”这个问题。一些朋友使用了iNove主题, 而他们希望能将文字标题换成他们的个性图片。 那么,现在我将为你演示如何将标题换成图片。

步骤1:创建一个标题图片。

步骤2:现在你的图片已经准备就绪了, 但你还需要编辑一下style.css文件以更换标题。

 2.1打开style.css文件, 并在文件中找到#title a”。

 2.2屏蔽或者移除以下代码。

1 #title a {

2 text-decoration:none;

3 color:#FFF;

4 /*width:250px;*/

5 height:30px;

6 display:block;

7 font-family:”Trajan Pro”;

8 letter-spacing:0;}

 2.3激活下面的代码。(移除掉开始位置的 /* 和 结束位置的 */ 即可)

1 #title a {

2 background:url(img/title.gif) no-repeat;

3 text-decoration:none;

4 color:#FFF;

5 width:250px; /* change ‘250′ to the width of you title.gif file */

6 height:30px;

7 text-indent:-999em;

8 display:block;

9 }

除此之外, 如果你还想移除掉副标题部分和增加标题的高度, 你可以跟着做下面的一些步骤。

步骤3:在templates/header.php文件中移除下面的代码。

<div id=”tagline”><?php bloginfo(’description’); ?></div>

步骤4:在style.css文件中找到“#title a”, 将“height:30px;” 改为“height:44px;”。

1 #title a {

2 background:url(img/title.gif) no-repeat;

3 text-decoration:none;

4 color:#FFF;

5 width:250px;

6 height:44px; /* change 30px to 44px */

7 text-indent:-999em;

8 display:block;

9 }

步骤5:如果你需要更高的标题, 可以修改一下“#caption”和“#title a”的相关属性, 下面是一个例子。如果你使用中文语言 (将WPLANG改成了zh_CN或者zh_TW), 那请打开 chinese.css文件修改一下“#caption”的属性。

1 #caption {

2 height:65px; /* change 44px to 65px (44 + 21 = 65) */

3 padding:25px 30px 0; /* change 21px to 0 */

4 }

1 #title a {

2 background:url(img/title.gif) no-repeat;

3 text-decoration:none;

4 color:#FFF;

5 width:250px;

6 height:65px; /* change 44px to 65px */

7 text-indent:-999em;

8 display:block;

9 }

 

随机日志

淘宝风云榜

Speak Your Mind

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!