给日志图片加个边框

各位可以看到我日志里的图片都会有一条白色的边框,这样看上去显得比较美观(个人认为).如果你也想在你的日志图片加上一个边框,那么就Follow Me>……………

方法很简单,只要更改两个文件就OK了 它们分别是Blog目录下的 common\ubbcode.asp 和 FCKeditor\fckstyles.xml 找到连个文件了吗?找到了就开始吧>………………

一.修改ubbcode.asp

第一步:打开common\ubbcode.asp 找到下面这段代码!

IF Not DisUBB=1 Then
IF Not DisIMG=1 Then
re.Pattern="(\[img\])(.[^\]]*)\[\/img\]"
Set strMatchs=re.Execute(strContent)
For Each strMatch in strMatchs
tmpStr1=(strMatch.SubMatches(1))
strContent=replace(strContent,strMatch.Value,"<img src="""&amp;tmpStr1&amp;""" border=""0"" alt=""""/>",1,-1,0)
Next

第二步.将这段代码更换为:

IF Not DisUBB=1 Then
IF Not DisIMG=1 Then
re.Pattern="(\[img\])(.[^\]]*)\[\/img\]"
Set strMatchs=re.Execute(strContent)
For Each strMatch in strMatchs
tmpStr1=(strMatch.SubMatches(1))
strContent=replace(strContent,strMatch.Value,"<img src="""&amp;tmpStr1&amp;""" style=""background-color:#FFF!important;border: 1px solid #CCCCCC;margin:3px; padding:4px;"" border=""0"" alt=""""/>",1,-1,0)
Next

实际上只添加了:style=””background-color:#FFF!important;border: 1px solid #CCCCCC;margin:3px; padding:4px;”” 这段代码,这段代码就是图片边框样式,各位可以自己更改>………

二.修改fckstyles.xml

第一步.找到文件FCKeditor\fckstyles.xml 找到下面这段代码 就在文件前面位置,大概20行

<Style name="Image on Left" element="img">
<Attribute name="style" value="padding: 5px; margin-right: 5px" />
<Attribute name="border" value="2" />
<Attribute name="align" value="left" />
</Style>
<Style name="Image on Right" element="img">
<Attribute name="style" value="padding: 5px; margin-left: 5px" />
<Attribute name="border" value="2" />
<Attribute name="align" value="right" />
</Style>

在前面增加一段代码

<Style name="边框" element="img">
<Attribute name="style" value="background-color:#FFF!important;border: 1px solid #CCCCCC;margin: 3px; padding: 4px;" />
<Attribute name="border" value="2" />
</Style>

这段代码就是建一个新的图片样式,这个样式会给图片加上边框,每一个STYLE标记定义一种样式,NAME是显示在下拉列表中的样式名,ELEMENT属性指定此样式所适用的对象,因为FCKEDITOR中的样式是上下文敏感的,也就是说,选择不同的对象,仅会显示针对这类对象定义的样式

在用fckeditor发表或编辑日志时,只要点中图片,然后在样式中就可以选择了

图片中可以看到,我把对图片的其它两个样式名称也改了一下,,,呵呵!!!

UBB编辑器不用进行甚么操作,,只要是用UBB编辑器编辑的日志它都会自动给图片加上边框,Fckeditor我还没找到怎么实现自动话,谁找到了告诉我啊….哈哈!!

希望对你有用吧..哈哈!!!

评论

  1. sime
    14年前
    2007-9-15 21:44:13

    你好,我使用你教的方法后,在图片靠右或者靠左设置了后,图片的边框就没了,可否检查下代码?
    谢谢!

  2. Eliven
    14年前
    2007-9-16 17:55:13

    Fckeditor中靠左和靠右的我没改代码,你可以照下面这段代码进行更改!

  3. sime
    14年前
    2007-9-19 22:14:38

    我通常都是使用UBB编辑的。能否给我说下UBB怎么改?不甚感激!
    回复:
    UBB的修改方法文中已经有介绍了,你自己看看好吗?如果有什么问题的话可以加我Q:303474431,谢谢来访!!!

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇