2009年3月5日星期四

去除Gmail右侧广告/隐藏聊天/隐藏邀请

预览:

安装地址:

http://userstyles.org/styles/15631

最新源码:

/*加大正文字体及行高*/
.ii.gt,.ii.gt *{font-size:14px !important;line-height:1.5 !important}
/*隐藏读信广告*/
table.T1HY1.nH.iY{width:100% !important;}
table.T1HY1.nH.iY td.tELAdc:first-child + td.tELAdc, table.T1HY1.nH.iY td.tELAdc:last-child .VB6tt + div > div:first-child > div:first-child + div,table.T1HY1.nH.iY td.tELAdc:last-child .VB6tt + div > div:first-child > div:last-child{display:none !important}
/*设置快捷操作位置*/
table.T1HY1.nH.iY td.tELAdc:last-child{position:absolute !important;top:-37px !important;right:0 !important;}
table.T1HY1.nH.iY td.tELAdc:last-child .nH{width:auto !important}
table.T1HY1.nH.iY td.tELAdc:last-child .hk{float:right !important;margin-left:1em !important;}
/*隐藏聊天*/
.nH.pz.pA.pX + div + div + div{display: none !important;}
/*隐藏邀请*/
.nH.pz.pA.pX + div + div + div + div{display: none !important;}

源码分析:

Gmail的HTML写的非常之“变态”且没有语义,导致我的选择器也跟着一起“变态”,⊙﹏⊙b汗~~

我们首先来看下Gmail左侧导航的HTML结构(为了方便,将注释写在了title属性中):

<div class="nH nn" style="width:155px;">
<div class="nH">
    <div class="nH pz pA pX" title="撰写邮件" />
    <div class="nH pp" title="收件箱等" />
    <div class="nH pp ps" style="-moz-user-select:none;" title="标签" />
    <div class="nH pp ps" style="" title="聊天" />
    <div class="nH pp ps" title="邀请" />
</div>
</div>

隐藏聊天:

.nH.pz.pA.pX + div + div + div{display: none !important;}

以撰写邮件为基准点,向下查找同级第三个div,将其隐藏。

这里的要点是相邻同胞选择器“+”

隐藏邀请同理。

读信页面的HTML结构如下:

<table cellpadding="0" class="T1HY1 nH iY">
<tr>
 <td class="tELAdc" title="邮件正文"></td>
 <td class="tELAdc" title="间距空白"></td>
 <td class="tELAdc" title="广告单元格">
     <div style="width: 0px;"
class="VB6tt" />
        <div style="width:
189px;" class="nH">            
<div class="nH">                
<div class="nH" title="快捷操作" />                
<div class="nH" title="广告" />                
<div class="nH u8" title="关于这些链接" />            
</div>
     </div>
 </td>
</tr>
</table>

去广告:

table.T1HY1.nH.iY td.tELAdc:last-child .VB6tt + div > div:first-child > div:first-child + div{display:none !important}

先找到该表格的最后一个单元格下的class="VB6tt"的元素,在找同级元素下的第一个div下的第一个div相邻的div(好绕口啊,+_+),将其隐藏。

其余同理....

2009-3-8更新:

  1. 加大正文字体至14px,加大正文行高至1.5
  2. 隐藏聊天

2009-3-7更新:

修复邮件新窗口中打开时正文显示不出来的BUG

2009-3-6更新:

  1. 去除读信页右侧广告
  2. 将读信页右侧快捷操作位置放到邮件与搜索栏之间靠右的位置
  3. 隐藏左侧邀请

3 条评论:

KC 说...

不错的说. 很讨厌这个广告栏..

Wooooo 说...

想写个 odd/even 的 stylish 样式,未遂。
比如 douban 影评,我想各个影评用斑马色区别,怎么写?
难道只能 +div 写无数遍? :)

ytzong 说...

firefox3.0.7还不支持:nth-child伪类,等以后支持了可以用:nth-child(even)及:nth-child(odd)来实现。jquery选择器里有even及odd,很方便,先用GM+jquery来写吧