css - Google 自定义搜索引擎和 Bootstrap3 样式问题

Question

我正在尝试将 Google CSE 集成到带有 BS3 的页面中。看起来 BS3 弄乱了搜索框和按钮。

http://jsfiddle.net/DTcHh/509/

这是代码在 IE 和 Chrome 中的样子 http://i.imgur.com/vungb7v.png

按钮中缺少搜索图标，Chrome 中也缺少底栏。

我试过玩

input.gsc-search-button 
.reset-box-sizing *

但由于我只有基本的 CSS 技能，所以我不知道如何解决这个问题。谁能告诉我应该如何解决这个问题，以便框和按钮在 IE 和非 IE 浏览器中看起来都很好。

Answer 1

您所要做的就是替换产生问题的 CSS 值，并了解您必须替换的内容以及您必须更改的值是什么，以便利用 Google Chrome 的“检查元素”功能。

可以在我自己的服务器上看到效果:

http://link-sa.ga/gcse/

---

源码下载:

https://www.dropbox.com/s/bo01xp2agvp7w4e/index.html

---

JSfiddle:

http://jsfiddle.net/rsm23/GPLyM/

阅读 GCSE 调用下的评论，css 代码应该是这样的:

<gcse:search></gcse:search>

<style type="text/css">

body {
    margin: 10px;
}

#gsc-iw-id1{
    height: 30px;
    border-color: #898989;
}

input.gsc-search-button-v2{
    width: 71px;
    height: 29px;
}

</style>