Fatal编程技术网
  • html/
  • Html Google Chrome无法正确呈现字体

Html Google Chrome无法正确呈现字体

html css google-chrome fonts google-chrome-devtools

Html Google Chrome无法正确呈现字体,html,css,google-chrome,fonts,google-chrome-devtools,Html,Css,Google Chrome,Fonts,Google Chrome Devtools,你好，我在这个网站上工作。最近我注意到google chrome浏览器上菜单中的网站字体加载不好，没有任何样式就卡住了，我一直在尝试解决这个问题，但找不到问题所在。我想知道是否有人知道我有什么问题。我还添加了用于菜单的css样式和html语法，以便您可以查看是否有问题 截图： HTML代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-st

你好，我在这个网站上工作。最近我注意到google chrome浏览器上菜单中的网站字体加载不好，没有任何样式就卡住了，我一直在尝试解决这个问题，但找不到问题所在。我想知道是否有人知道我有什么问题。我还添加了用于菜单的css样式和html语法，以便您可以查看是否有问题

截图：

HTML代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="es">
<!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Bamboo - Intranet Software</title>
    <meta name="description" content="Pequeñas, medianas y grandes compañías han implementado Bamboo Intranet como su plataforma de comunicación interna. Organizando, facilitando y agilizando dramáticamente las labores del día a día.">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta property="og:title" content="Bamboo - Intranet Software" />
    <meta property="og:description" content="Pequeñas, medianas y grandes compañías han implementado Bamboo Intranet como su plataforma de comunicación interna. Organizando, facilitando y agilizando dramáticamente las labores del día a día." />     
    <meta property="og:url" content="http://bamboo-intranet.com" />
    <meta property="og:image" content="http://bamboo-intranet.com/img/fbthumb.jpg"/>
    <link href="img/favicon.png" rel="shortcut icon" type="image/x-icon" />
    <link rel="stylesheet" type="text/css" href="css/normalize.min.css">
    <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <link rel="stylesheet" type="text/css" href="skins/tango/skin.css" />
    <link rel="stylesheet" href="css/sprites.css" />
    <link rel="image_src" href="http://bamboo-intrantet/img/fbthumb.jpg" /> 
</head>
<body>
    <!-- HEADER -->
    <header class="step0">
        <a href="http://bamboo-intranet.com/"><div class="logo"><img src="images/logo-bamboo.png" alt="Bamboo Intranet Software" /><h1>Bamboo - Intranet Software</h1></div></a>
        <nav>
            <ul>
                <li>
                    <a href="#container">CARACTERÍSTICAS</a>
                </li>
                <li>
                    <a href="#screenshots">SCREENSHOTS</a>
                </li>
                <li>
                    <a href="#beta_test">VERSIÓN DE PRUEBA</a>
                </li>
            </ul>
        </nav>
    </header>
    <!-- /HEADER -->
试着更具体一些

nav ul li  {
     list-style: none;
     float: left;
     font-size: 13px;
     color: #525252;
     margin-right: 5px;
}

nav ul li a {
    text-decoration: none;
    padding: 16px 14px;
    border-radius: 4px;
    line-height: 42px;
    color: #767676;
    transition: all .2s ease;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    font-family: 'Roboto', arial;
}

nav ul li a:hover {
    background-color: #262626;
    color: #ffffff;
}
如果这不能解决您的问题，请使用类；如果这不能解决您的问题，请使用浏览器中的inspect元素选项，查看CSS对HTML的作用

你能发一个到网站的链接吗？

你好，链接是www.bambor-intranet.com我实际上有过类似的风格，但为了测试它而改变了。嗨，看起来链接正在工作，在我的浏览器中测试了它们看起来100%正确。网站上的工作看起来不错，尽管我不懂西班牙语。这可能是一个很长的机会，但请务必在将来查看normalizer，它可能有助于解决类似的问题。这里是链接：酷男人很高兴你让它工作，让你的老板从你的背后，真的不知道为什么JS使它疯狂，但它工作得如此。。。很好的工作真的很棒的网站！保持健康 
nav ul li  {
     list-style: none;
     float: left;
     font-size: 13px;
     color: #525252;
     margin-right: 5px;
}

nav ul li a {
    text-decoration: none;
    padding: 16px 14px;
    border-radius: 4px;
    line-height: 42px;
    color: #767676;
    transition: all .2s ease;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    font-family: 'Roboto', arial;
}

nav ul li a:hover {
    background-color: #262626;
    color: #ffffff;
}