分享

为日志添加背景图片

 三木图馆 2014-05-09

 仅将具体应用时所需要的语法列出来,再对几个重要参数加以说明.

首先进入正常日志编辑模式,键入日志内容,并视个人需要进行排版编辑.然后进入HTML语法编辑模式.


   将下列语法粘贴至你的编辑页面内顶端:

 

<IMG src="背景图片链接地址" width=图片宽度值 height=图片高度值 align=right style="FILTER: alpha(opacity=100, finishOpacity=0,style=2) ">
<DIV style="FILTER: alpha(opacity=45, finishOpacity=45,style=0); FLOAT: left; WIDTH: 文本宽度值">
<DIV style="LINE-HEIGHT: 行间距值(pt); LETTER-SPACING: 字符间距值(em)">
<P><FONT color=#ffffff size=2>你的日志文字</FO
NT></P>
</DIV></DIV>

 

再将文字内容剪切并粘贴到上面语法中的"你的日志文字"的位置.


下面简要介绍一下上面语法中的两行主要命令语句的含义:

<IMG src=…….> ----控制日志中的背景图片,图片宽度及高度值均以px为单位;
align----
控制图片位置,但不要对此进行更改,否则无法实现文字浮于图片之上的效果;
Filter ----
控制背景图片的柔化滤镜,可修改其中数值已达到不同的效果,但注意style的值只能取1,2,3这三个数值.除柔化效果,还有翻转、发光、阴影等若干特效,但语法表述各有不同,可在互联网上查询相关语法.
注:在页面不同的布局方式下,日志宽度是不相同的,所以为更好的配合日志的页面效果,建议选择合适宽度的图片,具体可根据布局的实际情况(即日志的宽窄程度),将图片宽度分别设定在260px、350px、370px、550px、730px左右的近似值.
<DIV style="FILTER......>----控制日志文字的若干效果,其中Filter命令的使用方法与前述一致,也是调节柔化效果;文本宽度也采取px为单位,其最大值也要参照上面不同布局方式时所要求的近似宽度值.如果你希望文字完全分布在整个日志页面上,将WIDTH值设为100%即可.在设定了具体宽度的情况下Float命令可以省略,否则请予以保留.


关于文字与图片排版的注解
有关图片的位置安排,日志编辑工具中已提供了左右对齐和居中的功能,大凡用过Word对此都不陌生,也知道其最终实现的效果

文字方面的编排,主要运用了扩大字间距与行间距来实现更好的视觉效果及与图片相对完美的结合.

 

相关语法如下:
<div style="letter-spacing:0.3em;line-height:13pt">日志文字</div>
'Letter-spacing:',控制字母间的间距,对于中文就是字与字的间距.如果想实现英文单词之间间距的变化则使用'word-spacing:';
line-height----控制行间距,无论编辑英文中文均使用此命令.
实际应用中,尤其是与图片混排时,需反复调整上面的数值以达到最佳效果.另外需要注意的是,在日志预览界面所看到的图片与文本之间的搭配效果与实际发布后并不一致.

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多