Профиль пользователя OCSme光速幻想™ FaNtaSy:Speed of L...ФотографииБлогСпискиДополнительно Сервис Справка

为日志添加背景图片

首先进入正常日志编辑模式,键入你所需的日志内容,并视个人需要进行排版编辑。然后进入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>你的日志文字</FONT></P>
</DIV></DIV>

 

再将你刚刚编辑好的文字内容(注意,除了文字内容可能还会包含你进行格式编排后的若干语法语句)剪切并粘贴到上面语法中的“你的日志文字”的位置。

 


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

 


<IMG src=…….>控制日志中的背景图片,图片的宽度及高度值均以px为单位;align这一参数控制图片位置,但不要对此进行更改,否则无法实现文字浮于图片之上的效果。Filter控制背景图片的柔化滤镜,大家可以修改其中的数值已达到不同的效果,但注意style的值只能取1,2,3这三个数值。除了柔化效果外,还有翻转、发光、阴影等若干特效,但语法表述各有不同。下面会展示其中一些效果。在Space空间不同的布局方式下,日志宽度是不相同的,所以为了更好的配合日志的页面效果,建议选择合适宽度的图片,具体可根据布局的实际情况(即日志的宽窄程度)将图片宽度分别设定在260px、350px、370px、550px、730px左右的近似值。

 


<DIV style="FILTER…….>控制日志文字的若干效果,其中Filter命令的使用方法与前述一致,也是调节柔化效果。文本宽度也采取px为单位,其最大值也要参照上面不同布局方式时所要求的近似宽度值,如果你希望文字完全分布在整个日志页面上,那么将WIDTH值设为100%即可。在设定了具体宽度的情况下Float命令可以省略,否则请予以保留。

 


有一个问题需要注意,预览中文字相对于背景图片的位置往往与最终显示在日志中的位置不一样,这还需要你返回到该日志进行进一步的修改,这确实需要一些耐心,但相信经过一段时间的实际应用,你会总结出一些经验技巧的。

 

 
 
以下更详细的内容感谢James的分享
 
代码:

<IMG style="FILTER: alpha(opacity=100,finishOpacity=100,style=1); WIDTH: 200px; HEIGHT: 200px" src="图片地址" align=right>
<DIV style="FILTER: alpha(opacity=50,finishOpacity=50,style=0); FLOAT: left; WIDTH: 100%; LINE-HEIGHT: 14pt; LETTER-SPACING: 0.2em; HEIGHT: 100%">日志文字</DIV>

代码将在日志中,通过设定文本框浮于插入的图片上方,形成背景图片。

 

最简代码:

<IMG src="图片地址" align=right><DIV style="FLOAT: left; WIDTH: 100%">日志文字</DIV>

 

语法说明:

<IMG style="FILTER: alpha(opacity=100,finishOpacity=100,style=1); WIDTH: 200px; HEIGHT: 200px" src="图片地址" align=right>

<IMG> 图形标记,用于插入图像。 支持jpeg,gif,png等格式。

style="……" 设置图片风格。此语句缺省时 图片按正常方式(无渐变)显示。

FILTER:alpha(opacity=100,finishOpacity=100,style=1) 设置图片渐变滤镜阀值。FILTER ,滤镜;alpha,阀值。

opacity 开始的不透明度。参数为:0~100(百分比);
finishOpacity 结束的不透明度。参数为:0~100(百分比);
style 渐变风格设置。参数为0,1,2,3。0为正常,无渐变;1为线性渐变;2为径向 渐变;3为菱形渐变。

WIDTH,HEIGHT 图片宽、高尺寸,单位为px。若用百分比表示 width:100%;height:100%,则占满整个日志正文页面。

src="图片地址" 设置图片源。图片地址可以 是服务器本地址,也可以是URL地址(如http://www……)。

align=right 图片对齐方式为右对齐。此语句不能更改,否则不能使文字浮 于上方。

-------------------------

<DIV style="FILTER: alpha(opacity=50,finishOpacity=50,style=0); FLOAT: left; WIDTH: 100%; LINE-HEIGHT: 14pt; LETTER-SPACING: 0.2em; HEIGHT: 100%">日志 文字</DIV>

代码将插入一个无边框的文本框。


<DIV></DIV> 定位标记。

style="……" 设置文字风格。

filter:alpha(opacity=50,finishOpacity=50,style=0) 同上。

FLOAT: left 设置文字浮于上方,左对齐。 该参数最佳为left,如设为right(右对齐),则浮于图片上方的文字也要先占满左边位置。

WIDTH,HEIGHT 文本框宽、高尺寸。

LINE-HEIGHT 行高。单位为em,ex,px。em为字符宽度,ex为字符高度,px 为像素。

LETTER-SPACING 字符间距。单位为em,ex,px。em为字符宽度,ex为字符 高度,px为像素。

 插入的图片最好先用图像处理软件设置好尺寸。 

 你可以在日志的实时编辑模式(非HTML编辑模式)下用鼠标调整图片、文本框大小。

 实时编辑模式下,你可以利用<Tab>键选择当前编辑点(即从文本框转到图片框的编辑)。这个方法对于电脑配置低的朋友,会让你减少等待时间。

若 要“度量”空间日志的位置尺寸,可以先使用键盘上<Print Screen>抓屏键,然后使用Photoshop新建一个文 件,再用它的度量工具量出尺寸。(新建图片尺寸800*600,1027*768等对应当前显示器分辨率的尺寸,若为 Photoshop7.0以上,按<Print Screen>后再新建会自动设置尺寸)

-------------------------

 

图片风格示例:

主要是演示style的参数及不透明度的设定,大家慢慢比较吧。

 

□ 原图片

 

style="FILTER: alpha(opacity=50,finishOpacity=100,style=0)

 

style="FILTER: alpha(opacity=100,finishOpacity=50,style=0)

 

style="FILTER: alpha(opacity=0,finishOpacity=100,style=1)

 

style="FILTER: alpha(opacity=100,finishOpacity=0,style=1)

 

style="FILTER: alpha(opacity=0,finishOpacity=100,style=2)

 

style="FILTER: alpha(opacity=100,finishOpacity=0,style=2)

 

style="FILTER: alpha(opacity=0,finishOpacity=100,style=3)

 

style="FILTER: alpha(opacity=100,finishOpacity=0,style=3)

Комментарии (7)

Подождите...
Введен слишком длинный комментарий. Сократите его.
Ничего не введено. Повторите попытку.
Не удается добавить комментарий в настоящее время. Повторите попытку позже.
Чтобы добавить комментарий, необходимо получить разрешение одного из родителей. Запросить разрешение
Один из родителей отключил функцию добавления комментариев.
Не удается удалить комментарий в настоящее время. Повторите попытку позже.
Превышено максимальное количество добавляемых комментариев в день. Повторите попытку через 24 часа.
Для учетной записи отключена возможность добавлять комментарии, поскольку наши системы обнаружили, что вами, возможно, отправляется нежелательная почта другим пользователям. Если вы считаете, что учетная запись отключена ошибочно, обратитесь в службу поддержки Windows Live.
Выполните указанную ниже проверку безопасности, чтобы завершить добавление комментария.
Вводимые во время проверки безопасности символы должны совпадать с воспроизводимыми звуковыми символами или символами, отображенными на картинке.

Чтобы добавить комментарий, войдите с помощью идентификатора Windows Live ID (если используется учетная запись служб Hotmail и Xbox LIVE или программы Messenger, у вас уже есть идентификатор Windows Live ID). Войти


Нет идентификатора Windows Live ID? Зарегистрироваться

Без именипишет:
wow gold!All wow gold US Server 24.99$/1000G on sell! Cheap wow gold,wow gold,wow gold,Buy Cheapest/Safe/Fast WoW US EU wow gold Power leveling wow gold from the time you World of Warcraft gold ordered! wow power leveling wow power leveling power leveling wow power leveling wow powerleveling wow power levelingcheap wow power leveling wow power leveling buy wow power leveling wow power leveling buy power leveling wow power leveling cheap power leveling wow power leveling wow power leveling wow power leveling wow powerleveling wow power leveling power leveling wow power leveling wow powerleveling wow power leveling buy rolex cheap rolex wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow gold wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling wow power leveling -90916261030565
июнь 20
yanпишет:
学习中,谢谢了
 
июль 13
wu wuwuпишет:
thanks
июнь 1
Yan Naпишет:
怎么让文字到图片中间去啊
май 14
胖 洋пишет:
可是我弄完之后怎么就没有图片呢?奇怪~!
май 9
li linпишет:
我会常来~谢谢啦~
апр. 16
乐天游龙пишет:
谢谢了,我学会了
фев. 13

Обратные ссылки (1)

URL-адрес ссылки на эту запись:
http://deepmoverhythm.spaces.live.com/blog/cns!AADB175D2220D137!453.trak
Блоги, ссылающиеся на эту запись