晋江文学城
下一章 上一章  目录  设置

5、§纹饰篇§ ...

  •   ⒈ 颜色
      代码:<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>
note 作者有话说
第5章 §纹饰篇§

  • 昵称:
  • 评分: 2分|鲜花一捧 1分|一朵小花 0分|交流灌水 0分|别字捉虫 -1分|一块小砖 -2分|砖头一堆
  • 内容:
  •             注:1.评论时输入br/即可换行分段。
  •                 2.发布负分评论消耗的月石并不会给作者。
  •             查看评论规则>>