更改 Google 翻译小部件高度宽度

Question

我在页面中包含 Google 小部件，但我想增加下拉框的高度和宽度。我如何使用 CSS 更改此设置？

这是我的 Google 翻译小部件代码：

<html lang="en-US">
<body>
  <div id="google_translate_element"></div>
  <script type="text/javascript">
    function googleTranslateElementInit() {
      new google.translate.TranslateElement({
        pageLanguage: 'en',
        layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL
      }, 'google_translate_element');
    }
  </script>
  <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</body>
</html>

Answer 1

尝试为 class goog-te-combo 添加您的样式，并将其包含在您的 css。

示例工作代码here。

.goog-te-combo {
    width: 200px;
    height: 50px;
    font-size: 20px;
}

更改 Google 翻译小部件高度宽度

Change Google Translate widget height width

html

javascript

css

google-translate