原创 非首发。
前几天糖糖在首页上放置了一套十分个性漂亮的展示框,今天就分享出来啦~嘿嘿~
预览图(缩小版):
是不是很想要呢?接下来就一起跟糖糖DIY吧~过程可能有些复杂,不过别急,亲们慢慢来~
代码:(下面有说明。)
<DIV align=left><TABLE style="BACKGROUND: url(http://img.bimg.126.net/photo/3BBQ4TSiQ1oIOtXb3wtlxg==/4290804544977760361.jpg); CURSOR: url('')" height=454 cellSpacing=0 cellPadding=10 width=800 align=left border=0>
<TBODY><TR><TD vAlign=top><P> </P><P></P><P> </P><P></P>
<P><A href="博客地址"><IMG title=日志 alt="2009年3月27日 - 梦糖糖 - 香香奶茶坊" src="http://img.bimg.126.net/photo/huoBc2qf5xeTwyyztqC1-w==/2550726238953378226.jpg" border=0></A></A> <A href="相册地址"><IMG title=相册 alt="2009年3月27日 - 梦糖糖 - 香香奶茶坊" src="http://img.bimg.126.net/photo/txJZw_a-xePMUU5TFe1sBg==/2550726238953378232.jpg" border=0></A><A href="音乐地址"><IMG title=音乐 alt="2009年3月27日 - 梦糖糖 - 香香奶茶坊" src="http://img.bimg.126.net/photo/FcWuNUJSk-aoQlY3ewNHKQ==/2550726238953378234.jpg" border=0></A><A href="收藏地址"><IMG title=收藏 alt="2009年3月27日 - 梦糖糖 - 香香奶茶坊"src="http://img.bimg.126.net/photo/r8YizMwpLsYy7igeJbJf0A==/2550726238953378237.jpg" border=0></A><A href="博友地址"><IMG title=博友 alt="2009年3月27日 - 梦糖糖 - 香香奶茶坊" src="http://img.bimg.126.net/photo/b5EMqKxGLW2Hw0OcJA-0bw==/2550726238953378242.jpg" border=0></A><A href="关于我地址"><IMG title=关于我 alt="2009年3月27日 - 梦糖糖 - 香香奶茶坊" src="http://img.bimg.126.net/photo/UHK6YVz8nmVWIN79WCDp5A==/2550726238953378247.jpg" border=0> </A></P> 可以写下公告或心情,但最好别超过三十字,否则影响美观。 <DIV align=center>
<DIV style="BORDER-RIGHT: white 2px solid; BORDER-TOP: white 2px solid; SCROLLBAR-FACE-COLOR: #ffffff; SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: scroll; BORDER-LEFT: white 1px solid; WIDTH: 400px; SCROLLBAR-SHADOW-COLOR: #ffffff; COLOR: #000000; SCROLLBAR-3DLIGHT-COLOR: #ffffff; SCROLLBAR-ARROW-COLOR: #000000; BORDER-BOTTOM: white 2px solid; SCROLLBAR-DARKSHADOW-COLOR: #ffffff; HEIGHT: 300px; BACKGROUND-COLOR: #ffffff" align=center>写下内容。 </DIV></DIV>
<DIV></DIV><DIV></DIV></TD></TR></TBODY></TABLE></DIV><BGSOUND balance=0 src="音乐地址,支持MP3、WMA格式音乐。" volume=0 loop=3>
上面的代码就是那套展示框的代码了,现在糖糖来讲解一下。
紫色高光部分:
可以写三十字的公告或心情。请把“可以写下公告或心情,但最好别超过三十字,否则影响美观。 ”此段话删除后填写。
绿色高光部分:
填入你的展示内容,可能需要很多代码,这一点不要先急着做,底下会有更详细的讲解。请把“ 写下内容。 ”此段话删除后填写。
粉色高光部分:
填写音乐地址加入音乐,此段代码支持MP3格式,WMA格式音乐。请把“ 音乐地址,支持MP3、WMA格式音乐。”此段话删除后填入音乐地址。
糖糖推荐大家把代码粘贴到写日志的窗口内编辑,这样会更方便。
步骤一:复制上面代码,然后打开“写日志”,并单击写日志窗口上的“显示HTML代码”的按钮。
步骤二:粘贴代码,然后再单击“隐藏HTML代码”按钮。
步骤三:这是大家就可以看到展示框了,可能显示有点问题,不过把代码粘贴近模块后保存后就不会这样了,亲们请放心~
编辑紫色高光部分的内容时可以直接在代码状态时编辑;
编辑绿色高光部分时请在展示框显示状态下编辑,双击写下内容这几个字就会看到出现一个框框把一部分地方圈了起来,这是正常的,最后大家就可以自由的写下你想写的内容了;
编辑粉色高光部分需要在代码显示状态下编辑,在代码显示状态下,慢慢的把滚动条拉到最后,亲们就可以看到填入音乐地址的提示了,把音乐地址粘贴进去就大功告成了~
步骤四:编辑完毕后把显示状态调回显示HTML代码,把代码复制,直接粘贴进自定义模块中就行了。(注意:需把博客首页的模块显示方式设置全屏模式后方可使用。)
最后在给亲们提供一些常用代码:
1、添加图片: <img border="0" src="图片地址" />
<img src="图片地址"/>
2、超链接:
①文字连接: <a href="连接地址">连接文字</a>
②在新窗口中打开: <A href="连接地址" target=_blank>连接文字</A>
③图片连接: <A href="连接地址" target=_blank><IMG src="连接图片地址"></A>
3、键盘代替码:
①空格键:
②换行键(Enter): <BR>
4、文字跑马灯效果:
① 文字从右向左: <marquee>输入文字<marquee>
②文字从左向右: <marquee direction="right">你的文字</marquee>
③文字从上往下: <marquee direction="down">你的文字</marquee>
④文字从下往上: <marquee direction="up">你的文字</marquee>
5、字体加粗: <STRONG>要加粗的字</STRONG> |