分享

博客制作教程-3:制作设置导航栏的方法步骤

 兰黛公主 2011-05-09
 
 

 

 

博客风格制作教程-2:设置调整导航栏的方法步骤 - 山间溪流 -   山间溪流的休闲屋

  

博客风格制作教程-3:制作设置导航栏的方法步骤

编写制作:山间溪流

 

第一步:准备导航栏的图片素材 如图所示:尺寸为1004X45

博客制作教程-3:制作设置导航栏的方法步骤 - 山间溪流 -   山间溪流的休闲屋
 

 第二步:在顶栏图片设置完后,接着点击“导航条”,选择“选图”,上传导航栏背景图片,    设置平铺方式为“不平铺”,将导航条高度调整为“45px ”;

博客制作教程-3:制作设置导航栏的方法步骤 - 山间溪流 -   山间溪流的休闲屋

 

 第三步:点击“文字”选项,选择导航文字大小为“标准”,粗细为“加粗”,文字水平位置为    “270px ” 左右,文字宽度为“70px  ”左右,并调整颜色为深褐色。 

博客制作教程-3:制作设置导航栏的方法步骤 - 山间溪流 -   山间溪流的休闲屋

 

    经过背景和文字调整设置后,导航条效果如下图所示:

 

博客制作教程-3:制作设置导航栏的方法步骤 - 山间溪流 -   山间溪流的休闲屋

 

 第四步:设置“当前项”。

    所谓当前项,就是你现在浏览的项目,例如现在浏览的是博客的首页,那么当前项就是导航条中的“ 首页”。

    现在,我们开始来设置“当前项”。点击导航条下面的“当前项”,选择文字大小为“标准”,文字粗细为“加粗”,文字颜色为“黑色”,背景图片为原图。效果如下图所示。

博客制作教程-3:制作设置导航栏的方法步骤 - 山间溪流 -   山间溪流的休闲屋

  

第五步:设置“鼠标滑过项”。

   所谓“鼠标滑过项”,就是鼠标并没有点击这些项,而是鼠标在其上一滑而过所显示的效果。我的博客的“鼠标滑过项”,与当前项相同。

  说明:我的博客的当前项和鼠标滑过项设置的都很简单,我喜欢简洁的设计。其实这两项可以设计出许多花样来,例如各种各样的颜色和动画效果等,有兴趣的朋友可以尽情去发挥自己的创意。

 

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多