Baidu++

By blizzchris Last update Nov 19, 2011 — Installed 32,508 times.

关于自定义css功能

in
Subscribe to 关于自定义css功能 1 post, 1 voice

blizzchris Script's Author
FirefoxWindows

我自己觉得这个功能应该算是最有用的功能之一,但由于技术起点可能比较高,大家没时间去琢磨这个css,这个功能用得不是太多。

其实这个功能要是会用的话,好多功能都可以不用再新加模块,写css代码就可以实现了,所以我打算在这里把一些有用的css代码发布在这里,大家直接把需要的功能代码复制到自定义css的输入框里就行了

搜索框固定置顶(这个默认就有的)
table[width='100%'][height='54'] {
    position: fixed;
    z-index: 100; 
    background: #fff; 
    top: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 2px solid #aaa
}
body { margin-top: 60px; }

补充:这段代码适合使用autopagerize但没有开启快捷键,Opensearch也不是baidu的同学,因为如果你页面滚得太长要想在页面里重新输入搜索词要先滚回页顶,比较麻烦,这段代码能把顶部的搜索框固定在顶部,你怎么滚都能直接点到搜索框里。使用了快捷键功能的同学其实没必要用这个,因为直接Shift+/(也就是?)就跳到输入框里了,不想输入还可以按ESC再回来,也挺方便的。如果Opensearch(firefox的搜索框)本来就是baidu那就更不用了。

限制内容宽度,原布局优化模块(同样是默认css)
.f > a + br + font,
.f > p {
    display: block !important; max-width: 42em; 
}

.f > a + br + font + br {
    display: none;
}

补充:这段代码让每一条结果的文字宽度不超过42em,大概六百个像素的样子,这样的好处是防止在宽屏下文字被拉得过长,特别是不使用多列显示模块的时候,很容易“摇头晃脑”。Google的搜索结果也是限制在42em之内,能让你的视线保持在屏幕左侧位置

高亮显示变圆角
font[color='#c60a00'] {
    -moz-border-radius: 3px; /* 如果把3改成更大的数,角就更圆 */
}

补充:这段代码有个缺点,开启后滚动的时候会有点卡,特别是有autopagerize的时候,起码我这里是这样的,不知道是不是我的电脑不行。

高亮不要边框,类似快照的效果
font[color='#c60a00'] {
    border-width: 0 !important;
}
Cross
Presentational HTML allowed.
Use <code> for inline code and <pre> for code blocks. Use &lt; and &gt; for literal < and >.
We help break paragraphs and link your links.
or cancel