【问题标题】:Google Fonts & Safari SELECT problem谷歌字体和 Safari 选择问题
【发布时间】:2015-06-24 13:39:03
【问题描述】:

我从 Google 字体导入字体时出现选择问题。当我在 Safari 上单击选择时,网站会重新加载。在 Chrome、FF、IE 上一切正常。示例:

http://jsfiddle.net/stcvS/

谁能帮忙?

【问题讨论】:

  • 您使用的是什么版本的 Safari?什么操作系统?地雷在 Win 7 上的 Safari 5.0.5 上运行良好
  • Safari 5.1 (6534.50); MAC OS X 10.6.8

标签: html css webkit safari


【解决方案1】:

您可以通过 CSS 定位 Safari 并避免该问题:

@media screen and (-webkit-min-device-pixel-ratio:0) {

/* for Safari 5.1 bug http://stackoverflow.com/questions/7025826/google-fonts-safari-select-problem */

.formData SELECT {

    font-family:Helvetica, arial, sans-serif;
}

}

【讨论】:

    【解决方案2】:

    我不确定 JQuery 是否是您想要走的路线,但也许这会有所帮助:

    <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
    </head>
    <body>
        <select id="dropdown">
            <option>kiko</option>
            <option>atletico</option>
        </select>
    
        <script>
        jQuery(document).ready(function($){
            $("#dropdown").click(function(event) {
            event.preventDefault();
            });
        });
        </script>
    

    【讨论】:

      【解决方案3】:

      这似乎是 Safari 5.1 中的一个错误。每个带有 CSS @font-face 的 SELECT 都会因页面重新加载而失败。

      【讨论】:

      • 我的经历中发生了同样的事情
      【解决方案4】:

      最好使用&lt;ul&gt;&lt;/ul&gt;&lt;ol&gt;&lt;/ol&gt; 并应用必要的 css 和 javascript 来使用 &lt;select&gt;&lt;/select&gt; 在这种特殊情况下我们必须应用不同的 font-familiy 、 font-style 等。

      【讨论】:

        猜你喜欢
        • 2014-05-16
        • 2014-10-03
        • 2014-10-14
        • 2012-01-03
        • 2014-05-26
        • 1970-01-01
        • 2023-02-01
        • 1970-01-01
        • 2011-05-28
        相关资源
        最近更新 更多