[
收藏此章节]
[投诉]
文章收藏
§纹饰篇§
⒈ 颜色
代码:
<a href=http://地址>内容</a> 示例:<a href=http://www.jjwxc.net/oneauthor.php?authorid=28701>听雨轩</a>
效果:
听雨轩 小草明子问道:如何链接的时候是单独打开一个网页而不是在原有的基础上呢?
代码:
<a href=地址 target=_blank>文字</a> 示例:<a href=http://www.mingxiaoxi.com target=_blank>明晓溪官网</a>
效果:
明晓溪官网 为了不重复代码,以下我们都舍去target=_blank这一步。
事实上,target的参数还有self、parent等,不过咱们似乎用不到了吧。
有机会,我给大家介绍如何有框架来链接,还有锚记一步到位^_^ 详见§锚记篇§
特效字体链接 为了克服一旦加入链接,所有特效即刻失效的弊病,我们引入字体命令(详见§字体篇§):
代码:
<a href=http://地址><FONT face=字体 size=字号 color=颜色>内容</FONT></a> 示例:<a href=http://www.jjwxc.net/onebook.php?novelid=89612><FONT face=华文彩云 size=5 color=ff1493〗暗夜罗篇《血色泪心》</FONT></a>
效果:
暗夜罗篇《血色泪心》 现在我们仿真一下通常的链接样式:
明晓溪官网 是不是很可爱?
代码:<a href=http://www.mingxiaoxi.com><font color=blue><u>明晓溪官网</u></font></a>
链接的浮动文字说明title 对着右边这几个字描一描,不要点喔。看到这个效果了吗? →
明晓溪官网 <a href=http://www.mingxiaoxi.com title=明晓溪官网>明晓溪官网</a>
代码:<a href=网址 title=浮动文字>内容</a> 这里的浮动文字,不能加任何修饰,加了也是没有效果的。
图片链接 代码:
<a href=网页地址><IMG src=图片地址 style="border:2px"></a> 示例:<a href=http://www.jjwxc.net target=_blank><IMG src=http://static.jjwxc.net/images/channel_2010/logo.gif style="border:2px"></a>
效果:
无框图片链接border=0 图片周围有一圈很厚重的圈,因为默认图片链接有边界。只要加上border=0就可以了。
代码:
<a href=网页地址><IMG src=图片地址 border=0></a> 示例:<a href=http://www.jjwxc.net/><IMG src=http://static.jjwxc.net/images/channel_2010/logo.gif border=0></a>
效果:
图片链接的浮动文字alt VS title 代码:
<a href=地址 title=浮动文字说明><IMG src=图片></a> 示例:<a href=http://www.jjwxc.net/ title=晋江文学城><IMG src=http://static.jjwxc.net/images/channel_2010/logo.gif border=0></a>
上一章我们学到,图片是可以用alt来表示未现实的图片的内容的。
现在又学到title可以用在链接以及图片,那么,两者皆有时,到底谁更强悍呢?
<a href=http://www.jjwxc.net/ title=晋江原创网><IMG src=http://static.jjwxc.net/images/channel_2010/logo.gif border=0 alt=晋江文学城></a>
想要整齐地分隔章节?其实再简单不过了——<HR>就可以搞定。“作者有话说”的效果。
效果:
但是,如此分隔,是否太过单调呢?
下面,我们提供几种华丽的分隔花边,如果你有创意,欢迎你提供^_^
如果你采用了,也欢迎你提供采用的地址。与大家一道分享共赏;
也可让想要采用而没有采用的朋友先睹为快呀^_^
⒈ 花边
原理:结合居中、色彩和符号
代码:<CENTER><B><FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~</B></CENTER>
效果:
~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~﹡~ 注意:用完代码记得把文字颜色修改一下。否则就像这样,本该黑色的字变成叶绿色了。
~~~~~~如果是黑色非粗体是<FONT color=#000000>
示范网页 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
⒉ 花边标题
代码:
<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#1E90FF>〖.<FONT color=#AAAAAA>标题<FONT color=#1E90FF>.〗<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~</B></CENTER>
效果:
~﹡~﹡~﹡~﹡~﹡~﹡~﹡~〖.标题.〗~﹡~﹡~﹡~﹡~﹡~﹡~﹡~ 注意:可以根据字数增加适当调整减少花叶的个数,目标,保持花边在一行。
示范网页 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
⒊ 星星分隔
代码:
<CENTER><FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~<FONT color=#ffff00>★<FONT color=#cc99ff>~<FONT color=#99ccff>☆<FONT color=#cc99ff>~</CENTER>
效果:
~★~☆~★~☆~★~☆~★~☆~★~☆~★~☆~★~☆~★~☆~★~☆~ 示范网页:
《梦》by李雪瑜→第七章:永恒 《夜阑人静》by水煙兒→第一章:诞生 《琰璟》by焱.榊.零→第二章:舞依 ========================================================================
⒋ 以下由水妹儿提供:
①五福篱笆
…×<◆>×…×<◆>×…×<◆>×…×<◆>×…×<◆>×… <CENTER><B><font color=#008000>…<font color=#FF00FF>×<font color=#008000><<font color=#9999FF>◆<font color=#008000>><font color=#FF00FF>×<font color=#008000>…<font color=#FF00FF>×<font color=#008000><<font color=#9999FF>◆<font color=#008000>><font color=#FF00FF>×<font color=#008000>…<font color=#FF00FF>×<font color=#008000><<font color=#9999FF>◆<font color=#008000>><font color=#FF00FF>×<font color=#008000>…<font color=#FF00FF>×<font color=#008000><<font color=#9999FF>◆<font color=#008000>><font color=#FF00FF>×<font color=#008000>…<font color=#FF00FF>×<font color=#008000><<font color=#9999FF>◆<font color=#008000>><font color=#FF00FF>×<font color=#008000>…</B></CENTER>
②山门
...▲∩▲...V...▲∩▲...V...▲∩▲...V...▲∩▲...V...▲∩▲... <CENTER><b><font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#BBFFFF>▲<font color=#0000FF>∩<font color=#BBFFFF>▲<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#9999FF>V<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#BBFFFF>▲<font color=#0000FF>∩<font color=#BBFFFF>▲<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#9999FF>V<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#BBFFFF>▲<font color=#0000FF>∩<font color=#BBFFFF>▲<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#9999FF>V<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#BBFFFF>▲<font color=#0000FF>∩<font color=#BBFFFF>▲<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#9999FF>V<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.<font color=#BBFFFF>▲<font color=#0000FF>∩<font color=#BBFFFF>▲<font color=#FF00FF>.<font color=#0000FF>.<font color=#FF00FF>.</b></CENTER>
③笑脸
^-^ ^-^ ^-^ ^-^ ^-^ ^-^ ^-^ ^-^ ^-^ <CENTER><b><font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^ <font color=#0000FF>^<font color=#FF00FF>-<font color=#0000FF>^</b></CENTER>
④葡萄架
*∴⊥∴*……*∴⊥∴*……*∴⊥∴*……*∴⊥∴*……*∴⊥∴*……*∴⊥∴* <CENTER><b><font color=#33CCCC>*<font color=#9933FF>∴<font color=#0000FF>⊥<font color=#9933FF>∴<font color=#33CCCC>*<font color=#FF99FF>……<font color=#33CCCC>*<font color=#9933FF>∴<font color=#0000FF>⊥<font color=#9933FF>∴<font color=#33CCCC>*<font color=#FF99FF>……<font color=#33CCCC>*<font color=#9933FF>∴<font color=#0000FF>⊥<font color=#9933FF>∴<font color=#33CCCC>*<font color=#FF99FF>……<font color=#33CCCC>*<font color=#9933FF>∴<font color=#0000FF>⊥<font color=#9933FF>∴<font color=#33CCCC>*<font color=#FF99FF>……<font color=#33CCCC>*<font color=#9933FF>∴<font color=#0000FF>⊥<font color=#9933FF>∴<font color=#33CCCC>*<font color=#FF99FF>……<font color=#33CCCC>*<font color=#9933FF>∴<font color=#0000FF>⊥<font color=#9933FF>∴<font color=#33CCCC>*</b></CENTER>
示范网页:
牵思堂·牵思缕缕
其他花边研究中…… 历史上超费心思的花边 ══════════╮
〖mana大大介绍滴:〗╰☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆
直接复制就好。多点字的话,就多点复制点═;字少就去掉一些═
mecy提到为什么我用了第一个花边,花边下的文字都变成了红色了?
答:因为前边为了节省代码的情况下,只用了<font color=颜色代码>,而没用</font>;
也就是说,所有花边的颜色只有重叠的开始,没有结束。这样花边才能在一行。不明白原理没关系。
记住,只要用了花边以后,再用一次<font color=#000000>或<font color=black>
后边接文字就可以又变成黑色了。例如:<CENTER><FONT color=#20B2AA>~<FONT color=#DC143C>﹡<FONT color=#20B2AA>~</B></CENTER><font color=black>文字 …… 谢谢羽提醒:P
现代分割线:(这些都是外联的,不保证不失效,所以尽量不要全篇都用一种)
更多见:明晓溪官网·标签·分割线(5.13-6.17)
代码依次对应
<IMG src=http://image.17173.com/bbs/upload/2006/02/04/1139057026.gif>
<IMG src=http://image.17173.com/bbs/upload/2006/02/06/1139225245.gif>
<IMG src=http://image.17173.com/bbs/upload/2006/02/04/1139057765.gif>
<IMG src=http://image.17173.com/bbs/upload/2006/02/04/1139055291.gif>
<IMG src=http://image.17173.com/bbs/upload/2006/02/04/1139056522.gif>
插入书签
作者有话要说:推荐:(如果你也做分割线收集,请回帖分享地址^_^)
☆song的素材库☆阿秋のコピー素材
☆透羽的晋江分割线
这一章的“内容提要”其实也很简单,通常不能在内容提要放图片的原因是因为地址太长
那么,我们就来把它们缩短好了。登录http://0rz.tw
把要的图片地址放进去,点make short就能获得等同效果的短地址
例如http://image.17173.com/bbs/upload/2006/02/04/1139055291.gif → http://0rz.tw/d24st
然后再加上<IMG src=和>就好了^_^