首页 > 经验教程 > WordPress 博客文章内容段落首行缩进的方法
2012三月17

WordPress 博客文章内容段落首行缩进的方法

2012-03-17 10:23 | 作者:无天 | 分类:经验教程 | 浏览: 7477 Views 7评论 发表评论

不知道为什么,大多数的WordPress博客主题作者制作主题的时候,都没有把正文内容段落的首行缩进两格,这并不需要多大的功夫。段落首行缩进 两格,可以让文章整体看起来更加条理,读者阅读得更加轻松,这便是网站高手们常说的用户体验了。实现正文段落首行缩进的方法很简单,博客吧为需要的朋友介 绍下。

首行缩进方法介绍:

主要是通过CSS代码为WordPress博客正文段落添加首行缩进的样式。这里需要注意的是,每个WordPress博客主题作者使用的CSS样式类名都不一样,但是方法是一样的,这里以博客吧当前主题为例进行讲解说明。

实现的方法步骤:

1.登陆自己的WordPress博客,点击“外观”选项卡下的“编辑”选项进入主题编辑界面(可以把需要修改的主题文件下载到本地进行修改)

2.选择single.php文件进行编辑,找到WordPress博客正文内容标签代码:

<?php the_content((‘<div><strong>Read More…</strong></div>’));?>

在其前后分别添加<p>和</p>标签:

<p><?php the_content((‘<div><strong>Read More…</strong></div>’));?></p>

3.查找正文内容的CSS样式的类名或id选择器(一般在正文内容标签代码上面),如本站的

<div class=”post”>
<?php the_content((‘<div><strong>Read More…</strong></div>’));?>

其中的post使用是类名

4.选择style.css文件进行编辑,在样式文件中找到正文内容的CSS样式,找到该样式的派生选择器p,在派生选择器p中添加首行缩进代码text-indent:2em;,完整的代码如下:

#content .post p { color:#666; margin-bottom:7px; text-indent:2em;}

如果没有派生选择器p,可以为其添加一个,代码如下:

#content .post p {text-indent:2em;}

5.提交更新文件,刷新页面,WordPress博客正文内容段落实现首行缩进了。

提醒:其实这是很简单的CSS知识,建议不会的博主们学习一下基础的CSS知识。(转载互联网)

除非注明,文章均为无天博客原创,转载请以链接形式注明出处,谢谢。
本文地址:http://www.wutiansem.com/20120317808.html
标签:

7 Responses to “WordPress 博客文章内容段落首行缩进的方法”

  1. #1 塑料花盆 回复 | 引用 Post:2012-06-10 21:12

    代码很精辟!!!学习中

  2. 代码写的不错啊!!

  3. #3 冷库 回复 | 引用 Post:2012-05-07 13:06

    支持 加油 学习了~~

  4. #4 摄像手表 回复 | 引用 Post:2012-04-15 16:59

    很受用,谢谢博主的分享!www.vip007watch.com

    http://www.caselin.com

  5. #5 宝鸡SEO 回复 | 引用 Post:2012-03-21 00:11

    谢谢分享
    你好,你的站不错,可以跟你交换链接不?
    我的网站名称是:宝鸡seo地址 地址:http://www.234seo.com/
    快照最新
    如果你的站能跟我交换链接或进行seo知识交流,可以联系我的QQ705051553,

  6. #6 滨州房产网 回复 | 引用 Post:2012-03-17 21:22

    博主的风格挺好的,能不能分享一下啊,呵呵。

  7. #7 扫地机 回复 | 引用 Post:2012-03-17 11:15

    学校里没有学到过,正在自学,博主的文章还是有帮助。

发表评论