给头部加个我的微博图标

知更鸟
知更鸟
知更鸟
站长
2587
文章
0
粉丝
HotNews主题8410,683阅读模式
摘要  有童鞋在http://faq.wopus.org问如何在头部加个关注微博的图标,其他人也可能有此需要,于是把回复内容转过来,供大家折腾玩。   HotNews主题LOGO右侧有...

有童鞋在http://faq.wopus.org问如何在头部加个关注微博的图标,其他人也可能有此需要,于是把回复内容转过来,供大家折腾玩。

HotNews主题LOGO右侧有一小块空白,很多童鞋可能也一直想挤出些地方放点什么,其实作网页与写书法绘画一样,需要留白,给人更多想象的空间,更有层次感,否则密密麻麻的,看着让人眼花,心烦, 不过放个小图标装饰一下也不为过,效果如图。

下面开始。打开所有以header开头的模版文件在:

  1. <?php include('includes/time.php'); ?>

下面加上:

  1. <div class="topimg"><a title="关注微博" target="_blank" href="https://zmingcx.com/">关注微博</a></div>

打开主题样式文件style.css首先把:

  1. .header_c {
  2.     width: 980px;
  3.     }

改为:

  1. .header_c {
  2.     width: 980px;
  3.     position:relative;
  4.     }

为方便图标定位之用。

随后在这句后面加上一句:

  1. .topimg a {
  2.     position: absolute;
  3.     background:url(images/dd.png) no-repeat;
  4.     top:27px;
  5.     right:20px;
  6.     width:100px;
  7.     height:25px;
  8.     text-indent:-10000px;
  9. }

其中的文字、链接及图片可根据自己的喜好更换,左右位置通过修改right:20px控制,本人不写围脖就不加了,提供一张作好的图片。

 

本站文章大部分为原创,用于个人学习记录,可能对您有所帮助,仅供参考!

weinxin
我的微信
微信号已复制
版权声明
本站原创文章转载请注明文章出处及链接,谢谢合作!
 
评论  84  访客  69  作者  13
    • 李征
      李征

      一直在调试这个微博按键的位置,老是错位到跟 2012年3月17日 星期六您是第 1898 位访客这句话平行,不知道是哪里出了错误,求鸟哥帮忙!

      • yumanutong
        yumanutong

        鸟哥,我改了,错位也,样式走到中间那里了!

          • yumanutong
            yumanutong

            @ yumanutong OK了,都是我笨,文章中images/dd.png改为自己图片绝对地址,就OK了!

              • 真威武
                真威武

                @ yumanutong 我的问题跟你的一样,地址也改了,还是不行,是咋个原因呢

              • chachachade
                chachachade

                @ yumanutong “熊猫烧香”病毒?你的头像怎么那么奇怪?你的电脑中毒了么?

              • 萧怀伦
                萧怀伦

                你好,我想在这个位置放上百度的我喜欢按钮请问怎么弄,谢谢!请指点

                • 谷哥100°
                  谷哥100°

                  学习楼主分享,搞定。

                  • beyondme37
                    beyondme37

                    添加了,然后被adblock给屏蔽了。。。那肿么办。。

                    • 手机巴士
                      手机巴士

                      好像是2.7.1用不到,按教程改了,一样不显出来,图片也绝对地址也不行,下版本建议加个关注按键开关,因为现在用这个的多,感谢知更鸟

                      • 吴文辉IT博客
                        吴文辉IT博客

                        鸟哥,能问下你代码高亮是怎么实现的吗?是用的哪个插件还是?就这篇文章的

                        • 瑞俪儿
                          瑞俪儿

                          Copyright © 2013 测试 保留所有权利. Theme by Robin

                          除了首页正常,其它 Copyright © 没对齐。
                          这样
                          Copyright

                          2013 测试 保留所有权利. Theme by Robin

                        匿名

                        发表评论

                        匿名网友

                        拖动滑块以完成验证