在zblog中加入调整文章字体大小功能

时间:2011-08-26 18:59:22

 一般来说,正文字体大小为12px是比较合适的,大都是网站的界面字体都是12px。

但为了适合不同人群的需要,大多数网站都有调节正文字体大小的功能,正文内容与周围内容合适大小比,更能突出页面内容的重点,增强用户体验。

在ZBLOG中我们可以JS变量调用的方法为文章内容增加调节字体大小功能:

第一步:登陆ZBLOG后台通过文件管理功能(或FTP),在根目录找到“/SCRIPT/common.js”文件,在该文件最后一行增加如下代码:

  1. function SetFont(num){var divs = document.getElementsByTagName("div");for (var i = 0; i < divs.length; i++)if(divs[i].className=="post-body")divs[i]['style']['fontSize']=num;}   

 

第二步:在主题目录中找到“TEMPLATE/b_article-single.html”,在标题或文章末端合适位置后面加入如下代码:

  1. 字体: <a href="javascript:SetFont('10px')"></a>-<a href="javascript:SetFont('12px')"></a>-<a href="javascript:SetFont('14px')"></a>   

 

第三步:修改完毕后,文件重建,OK。

说到文章字体,还有一个因素就是字体样式,如“font-family:Arial,Helvetica,sans-serif;”,一般来说,首选字体Arial是最合适阅读的,其次是备选字体“Helvetica,sans-serif”。

 

CSS字体定义:

字体名称属性(font-family),有多种字体可以选择,按顺序调用。如:font-family:Arial,宋体,Helvetica,sans-serif;

字体大小属性(font-size),字体大小的设置可以有多种方式,最常用的就是pt和px(pixel)。如:font-size:16pt

字体风格属性(font-style),这个属性有三个值可选:normal, italic, oblique,italic, oblique都是斜体显示。如:font-sytle:italic

字体颜色属性(color),可以选择颜色名称或颜色16进制代码,如:color:Red或color:FF0000

CSS段落定义:

段落首行缩进两字字符:text-indent:2em

上下行间隔距离,及行高:line-height:20px

 

本站所有文章均为天行博客原创,转载请注明来源及出处!

作者:宇天行 (关于我

本文首发地址:https://www.huceo.com/post/269.html

或许您还会喜欢这些文章:

Tags: 作者:宇天行 | 分类:开发技术 | 评论:42 | 浏览:7526

您正在以游客身份发表评论:

必填

选填

选填

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。