Question

我遇到了webkit浏览器（Opera和Chrome）的问题。我在我的网站上添加了一些字体，当我在webkit浏览器中打开时，文本根本就没有出现。但是，如果我调整窗口大小或打开检查器工具，文本将正常显示。 http://www.roko.com.br/wergo

@font-face {
    font-family: Nixie One;
    src: url('nixieone-webfont.eot');
    src: url('nixieone-webfont.eot?#iefix') format('embedded-opentype'),
         url('nixieone-webfont.woff') format('woff'),
         url('nixieone-webfont.ttf') format('truetype'),
         url('nixieone-webfont.svg#nixie_oneregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

INDEX.HTM

<div class="col-md-6" style="text-align:justify;padding:20px;font-family: Nixie One, helvetica">

                        <h1>Gostou a ideia?</h1>
                        <h4>Deixe-nos o seu email e te mandamos notícias! Prometemos não lotar sua caixa de emails!</h4>
                        <form>
                            <div>
                                <input type="text" name="email" style="border:1px solid #ccc;width:100%" />
                            </div>
                            <br/>
                            <div style="width:100%;" align="center">
                                <button class="btn btn-danger btn-large" style="width:60%">Enviar</button>
                            </div>

                        </form>

                    </div>

Answer 1

尝试从您的CSS中删除所有你的@ font-face并尝试将<link href='http://fonts.googleapis.com/css?family=Nixie+One' rel='stylesheet' type='text/css'>

放在首位

并为您的网站font-family: 'Nixie One', cursive;添加此样式字体并尝试使用。

Answer 2

发现我的问题。 holder.js和webkit有些问题。不知道为什么，但用额外的字体隐藏我的文本。删除它，停止了那个bug。

Webkit不使用@ font-face显示文本

2 个答案: