Banner now clickable
Mar 24th, 2007 by SkyLanD
我现在用的这个主题Gray Wolf自从自己修改了Banner以后,就隐藏了Blog标题和Description,现在看完单页日志要回首页只有点击导航栏里的"Home",一条大大的Banner只能作为一个背景(background-image),不能进行任何点击操作感觉非常别扭,参考SUN的方法并研究了一下,利用CSS的cursor属性和相对坐标位置实现了背景Banner的可点击效果。
Head区的CSS这样修改了一下:
#header {
background: #FFF url('images/header_ot.jpg') repeat-x;
height: 116px;
width: 818px;
margin-left:0px !important;
position: relative !important;
padding-top: 0px;
border: 0px !important;
}
然后给链接"a"加一个Class: blogname
a.blogname {
position: absolute;
display: block;
background: transparent;
left: 0px;
top: 0px;
width: 818px;
height: 116px;
cursor: pointer;
border: 0px;
text-indent: -9900px; /* 将标题隐藏*/
overflow: hidden; /* 配合text-indent, 针对firefox*/
}
这样修改一下主题的Head把标题链接"a"加上class="blogname"就行了。过两天准备用Photoshop的Slice Tools分割盛世英超Blog的Banner,用相同的方法让那些小队徽链接到俱乐部官方主页。