造型Google搜索API框和搜索按钮

Question

我正在尝试在Google搜索上使用自己的CSS，但我没有留下任何东西。我该如何将自己的CSS放在上面？是API，CSS等吗？每当我对整个页面重新加载进行更改时

api：

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

我不知道我是否必须在JS或其他地方进行样式。

谢谢您的帮助

非常感谢

Answer 1

您可以尝试以下代码...

<div id="quicksearch">
<form id="cse-search-box" action="search.html">
<div style="float:left">
<input type="hidden" value="005780201047221652427:jopxospdjss" name="cx">
<input type="hidden" value="FORID:10" name="cof">
<input type="hidden" value="UTF-8" name="ie">
<input type="text" onblur="if(this.value=='')value='Search Site';" onfocus="if(this.value=='Search Site')value=''" value="Search Site" class="searchBox" size="28" name="q">
</div>
<div style="float:left;">
<input class="image" type="submit" value="" name="sa">
</div>
</form>
</div>

您可以使用自己的CSS尝试以下操作： -

#quicksearch .searchBox{background:#666666; border:#666666 0px solid; height:22px; color:#CCCCCC; font-size:12px; padding-left:6px;}
#quicksearch .image {
    background: url("search.png") no-repeat scroll center top transparent;
    border: 0 none;
    cursor: pointer;
    display: block !important;
    height: 23px;
    width: 23px;
}

用于显示搜索记录，创建一个带有名称" search.html"的新文件，然后在那里粘贴以下代码。搜索记录将显示在此页面下方。

<div id="cse-search-results"></div>
            <script type="text/javascript">
              var googleSearchIframeName = "cse-search-results";
              var googleSearchFormName = "cse-search-box";
              var googleSearchFrameWidth = 800;
              var googleSearchDomain = "www.google.com";
              var googleSearchPath = "/cse";
            </script>
        <script type="text/javascript" src="http://www.google.com/afsonline/show_afs_search.js"></script>