友情链接拓展出来的文字点击跳转图片点击跳转代码总结

admin 网站技能 2016-01-01 浏览

说明：

1、从一个友情链接代码演变出来的点击文字，点击图片跳转代码总结

2、友情链接代码可以拓展形成其他的点击代码

友情链接

最常用的一个友情链接的代码

以下是最常用的一个友情链接的代码：

<div align="center">
    <table width="980" height="35" border="0" align="center">
        <tr>

            <td>
            友情链接：  
            <a target="_blank" href="#">One</a>
             | 
            <a target="_blank" href="#">Two</a>

             | 
            <a target="_blank" href="#">Three</a>

             | 
            <a target="_blank" href="# ">Four</a>

             | 
            <a target="_blank" href="#">Five</a>

             | 
            <a target="_blank" href="#">Six</a>
             | 
            <a target="_blank" href="#">Seven</a>
             | 
            <a target="_blank" href="#">Eight</a>
             | 
            <a target="_blank" href="#">Nine</a>
             | 
            <a target="_blank" href="#">Ten</a>
             | 
            <a target="_blank" href="#">Eleven</a>
            </td>

        </tr>
    </table>
</div>

这个代码形成后如下图：

对于以上这款代码，说明以下几点：

（1）这个友情链接代码是最简单最实用的一款代码；

（2）这个文字点击的友情链接基本把所有的常用的一些代码都包括在内了；

（3）修改非常简单。

图片链接

滚动图片&点击跳转代码

这是一个滚动图片点击跳转的链接代码：

（1）代码如下：

这是一个图片移动可以点击的代码：

结尾语：
<fieldset class="tn-Powered-by-XIUMI" style="margin-top: 0.8em; margin-bottom: 0.8em; max-width: 100%; box-sizing: border-box; min-width: 0px; font-size: 1em; white-space: normal; background-color: rgb(255, 255, 255); line-height: 1.4; word-wrap: break-word !important;">
<section class="tn-Powered-by-XIUMI" style="padding: 10px; max-width: 100%; box-sizing: border-box; border: 2px dashed rgb(182, 182, 182); font-size: 1em; font-family: inherit; font-weight: inherit; text-align: inherit; text-decoration: inherit; color: rgb(51, 51, 51); background-color: rgb(244, 244, 244); word-wrap: break-word !important;">
<section class="tn-Powered-by-XIUMI" style="max-width: 100%; box-sizing: border-box; word-wrap: break-word !important;">
<section class="tn-Powered-by-XIUMI" style="max-width: 100%; box-sizing: border-box; word-wrap: break-word !important;"><marquee direction="right" height="100" scrollamount="2" scrolldelay="30" width="90%">

<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>

<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>

<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>

<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>

<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>

</marquee></section>
</section>
</section>
</fieldset>
正文内容在这里：

以上代码就是基本的一个图片移动代码，并且图片还可以继续添加，只需要把
<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>
这一段代码继续往下加就可以啦。

（2）说明

这个代码可以让一些图片移动过程中，并且可以点击其中的图片跳转我们设定的网站…

重点内容

点击跳转

以上两个核心内容都是点击跳转，不管文字还是图片，最基本的点击代码如下：

文字点击代码：

<a target="_blank" href="#">Two</a>

图片点击代码：

<a href="http://www.lxnianhua.com/" target="cont"><img border="0" height="100" src="https://img.alicdn.com/imgextra/i1/652165390/O1CN0148xXVw1pgfL7NwTNM_!!652165390.jpg" width="100" /></a>

其他的有关友情链接的一些代码：ee1源享君
ee1源享君
1、点击图片跳转：最基本的跳转代码ee1源享君

-最常用，最基本的点击图片跳转代码如下：ee1源享君
ee1源享君

ee1源享君

-点击图片跳转百度网站的代码如上面所示ee1源享君

2、点击图片出现文字代码：鼠标移动到图片上会自动出现文字

- 鼠标移动到一个图片上会自动出现一个文字代码。

- 其中：

src后面就是图片地址，后面的文字的名称