打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
框式图文导航的制作&代码
框式图文导航的制作
 
框式图文导航就是将博客的浏览导航制作成图片与文字的链接形式,使博客图文并茂,既方便实用又美观漂亮。
博客浏览导航可分为首页导航(又称一级导航)和日志分类导航(又称二级导航)。
框式图文导航的制作包括单框导航、双框导航及多框导航等多种样式。现依次介绍如下。
一、单框导航代码:
<TABLE borderColor=#ff0000 cellSpacing=10 cellPadding=0
width="80%" bgColor=#080808 border=3>
<TBODY>
<TR>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank>
<FONT color=#ff0000 size=2>此处是导航名称 </FONT></A> </P></TD>
效果图1:
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
导航引领点击欣赏
 
二、双框代码:
<TABLE borderColor=#ff0000 cellSpacing=10 cellPadding=0 width="80%"
bgColor=#080808 border=3>
<TBODY>
<TR>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank>
<FONT color=#ff0000 size=2>此处是导航名称 </FONT></A> </P></TD>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank><FONT color=#ff0000
size=2>此处是导航名称
</FONT></A> </P></TD></TR></TR></TR></TBODY></TABLE>
效果图2:
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
相逢是首歌
祝福你一生
三、多框代码:
<TABLE borderColor=#ff0000 cellSpacing=10 cellPadding=0 width="80%"
bgColor=#080808 border=3>
<TBODY>
<TR>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank><FONT color=#ff0000
size=2>此处是导航名称 </FONT></A> </P></TD>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank><FONT color=#ff0000
size=2>此处是导航名称
<TABLE borderColor=#ff0000 cellSpacing=10 cellPadding=0 width="80%"
bgColor=#080808 border=3>
<TBODY>
<TR>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank><FONT color=#ff0000
size=2>此处是导航名称 </FONT></A> </P></TD>
<TD><A href="此处是链接地址" target=_blank><IMG height=80
src="此处是图片地址" width=80 border=0></A>
<P>&nbsp;<A href="此处是链接地址" target=_blank><FONT color=#ff0000
size=2>此处是导航名称
</FONT></A> </P></TD></TR></TR></TR></TBODY></TABLE>
效果图3:
祝福你一生
遇上你是缘
真的好想你
相逢是首歌2
说明: 1、width=“80%”是边框的大小,可以根据自己模块大小调整; 2、边框颜色可根据自己博客风格调整搭配; 3、字体大小和颜色可调整; 4、大框内的小边框粗细及颜色可根据自己爱好调整搭配。
欣赏效果图  
相逢是首歌1
相逢是首歌2
真的好想你
黄菊花开了
相逢是首歌2
祝福你一生
遇上你是缘
真的好想你
黄菊花开了
相逢是首歌1
祝福你一生
遇上你是缘
真的好想你
黄菊花开了
制作之中
制作之中
制作之中
制作之中
制作之中
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
如何制作首页模块导航
博客链接代码
如何制作网校首页图片导航
编辑日志常用代码
淘宝网店铺装修常用代码大全
精美的移动导航链接表格
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服