html - 更改谷歌自定义搜索栏的高度

Question

我想更改 google 自定义搜索栏的高度，有很多选项可以通过使用 google 自定义搜索编辑器来设置搜索栏外观的样式，但是没有一个选项允许您更改高度。

目前搜索栏有一个顶部和底部的边框，这看起来确实没有必要，它太大了而且真的不需要。

这是安装在我的标题栏中的谷歌搜索栏，因为它太高了，你可以看到它在几圈之间。

这是谷歌搜索栏的代码:

<script>
                  (function() {
                    var cx = '007301268677233961693:36-nzkwdslc';
                    var gcse = document.createElement('script');
                    gcse.type = 'text/javascript';
                    gcse.async = true;
                    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
                        '//cse.google.com/cse.js?cx=' + cx;
                    var s = document.getElementsByTagName('script')[0];
                    s.parentNode.insertBefore(gcse, s);
                  })();

                </script>
                <gcse:search></gcse:search>

如果有人知道如何更改此搜索栏的高度，我希望它的高度为 64 像素。

提前感谢您的帮助。

Answer 1

您是否考虑过构建您自己的自定义搜索栏、删除脚本并将其替换为包装在 div 中的自定义表单，您最终会根据自己的喜好设置样式？ 请注意，要使其正常运行，您需要 Google 为您的网站提供的个人 ID。

<div class="searchbar">
<form method="get" id="searchform" id="searchbox_007301268677233961693:36-nzkwdslc" action="result.html">
<div>
<input value="007301268677233961693:36-nzkwdslc" name="cx" type="hidden"/>
<input value="FORID:11" name="cof" type="hidden"/>
<input type="text" value="Search..." name="s" id="s" onfocus="defaultInput(this)" onblur="clearInput(this)" />
<input type="submit" id="searchsubmit" value=" " />
</div>
</form>
</div>

您还需要设置将由搜索表单调用的 result.html 页面。 查看此页面以获取实现结果页面所需的代码:http://arindambose.com/blog/?p=102