博客装修23：如何在页面两侧添加浮动对联 如何在文章中文字环绕图片

如何在页面两侧添加浮动对联

 

如何在博客页面两侧添加漂亮的对联挂件来装饰你的博客，跟我来！

　　第一步、登录新浪博客，输入“登录名”“密码”和“验证码”后点击“登录”。


登录新浪博客

　　第二步、点击进入主页上方的“控制面板”。


进入“控制面板”

　　第三步、进入“个人首页维护”。


进入“个人首页维护”

　　第四步、进入“自定义空白模板”。


进入“自定义空白模板”

　　第五步、点击“新增”新增一个空白面板。


新增一个空白面板

　　第六步、在“面板标题”写好面板的名称，勾选面板下方的“显示源代码”勾选框，此处注意一定要勾选，否则将不能成功。 将以下代码贴入文本框中，点击“保存”。

　　左侧对联代码：

<DIV style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; FILTER: progid:DXImageTransform.Microsoftpadding:8px; ; LEFT: expression_r(eval_r(document.body.scrollLeft)+eval_r(document.body.clientWidth)-970); BORDER-LEFT: medium none; BORDER-BOTTOM: medium none; POSITION: absolute; ; TOP: expression_r(eval_r(document.body.scrollTop)+eval_r(document.body.clientHeight)-500); TEXT-ALIGN: center"><IMG src="图片网址" border=0></DIV>
 
　　右侧对联代码：

<DIV style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; FILTER: progid:DXImageTransform.Microsoftpadding:8px; ; LEFT: expression_r(eval_r(document.body.scrollLeft)+eval_r(document.body.clientWidth)-110); BORDER-LEFT: medium none; BORDER-BOTTOM: medium none; POSITION: absolute; ; TOP: expression_r(eval_r(document.body.scrollTop)+eval_r(document.body.clientHeight)-500); TEXT-ALIGN: center"><IMG src="图片网址" border=0></DIV>
 
　　代码说明：
 
　　1、clientWidth后面负数的绝对值越大，图片越靠近左侧；
　　2、clientHeight后面负数的绝对值越大，图片越靠近上部；
　　3、“图片URL地址”处加入你想用到的图片的URL地址即可，建议使用BLOG内部的图片；
　　注意：前两个参数需要根据图片的实际情况来设定，代码中的8px保持默认即可，无需改动；
　　4、为了显示正常，请将电脑显示器分辨率设置为1024×768。
 
　　现以添加左对联为例

贴入代码，点击“保存”

　　


系统提示添加成功，点击“确认”

第七步、点击“控制面板”左侧“BLOG信息设置”中的“定制我的首页”。


点击“定制我的首页”

　　第八步、点击“添加模块”。


点击“添加模块”

　　第九步、勾选刚刚建立好的“对联”面板，点击下方的“选取”。


选取“对联”面板

　　第十步、刚刚建好的显示对联面板出现，点击“保存设置”。


对联添加完成

 

 

如何在文章中文字环绕图片

 

 

如何做到文章中文字环绕图片的效果？

　　可以在文章代码中添加属性来修改。

　　首先，发表一篇文章，在文章发表框中输入好文字内容。


先输入好文字

　　在文章中适当部位插入一张图片，注意，图片的大小不要太大，文章的宽度是480像素，最好要小于这个数值。


插入图片

　　勾选“显示源代码”勾选框，编辑插入图片的代码，在<IMG ……>标签中的最后加入属性，align=***,***可以为三种选项，align=left图片居左，align=right，图片居右，align=center，图片居中。


编辑图片代码

　　取消“先是源代码”，看看效果。