Font-size 不适用于 Opera 和 Chrome，但适用于 Firefox，通过其他参数可以正常工作答案

【问题标题】：Font-size is not working on Opera and Chrome, but works on Firefox, thouh other parameters are workingFont-size 不适用于 Opera 和 Chrome，但适用于 Firefox，通过其他参数可以正常工作
【发布时间】：2018-02-09 02:51:36
【问题描述】：

字体大小不适用于 Opera 和 Chrome，但适用于 Firefox。适用于边框、边距、动画、大小、字体系列，但不适用于字体大小。

我在嵌套跨度中有一个复杂的 ul-li 导航。我无法在内部<a> 上设置字体大小。除了html - 16px，我还没有在其他部分/元素上设置字体。我尝试了 rem 和 px 单位，在 Opera 和 Chrome 中都没有。有没有一种特殊的方法来设置深嵌套元素的字体大小？为什么其他规则有效？

<div> <span>..12 spans... <span> 
   <a class='a.aBtn' ><span class='navDecr' ></span></a>
   ...other 12 <a> tags ...
   <ul> <li></li> ...12 li ... </ul> 
 </span> ... 12 closing spans </div>

//the same error a.aBtn span.navDescr {}

a span.navDescr { 
    font : 2rem, "Open Sans", sans-serif !important; //this is stroked through 
    text-align: right;
    text-align-last:left;
    font-weight:normal; 
    font-variant: normal;
    font-style:normal;
    line-height : 1.5; //will be multiplied with font_size
    font-stretch: normal;
    font-size-adjust:1;
}

如果我尝试将字体放在li 子项上，它也不起作用。适用于边框、边距、动画、大小、字体系列，但不适用于字体大小。

【问题讨论】：

你试过分离font-size和font-family吗？

标签： css google-chrome font-size opera

【解决方案1】：

如果你想改变字体的大小，你应该使用font-size，如果你想改变它的字体，你应该使用font-family

改变

<a class='a.aBtn' ><span class='navDecr' >Test</span></a>

a span.navDescr { 
    font : 2rem, "Open Sans", sans-serif !important; //this is stroked through 
    text-align: right;
    text-align-last:left;
    font-weight:normal; 
    font-variant: normal;
    font-style:normal;
    line-height : 1.5; //will be multiplied with font_size
    font-stretch: normal;
    font-size-adjust:1;
}

到

<a class='aBtn' ><span class='navDecr' >Test</span></a>

.aBtn span { 
    font-size : 2rem; 
    font-family: "Open Sans", sans-serif !important; //this is stroked through
    text-align: right;
    text-align-last:left;
    font-weight:normal; 
    font-variant: normal;
    font-style:normal;
    line-height : 1.5; //will be multiplied with font_size
    font-stretch: normal;
    font-size-adjust:1;
}

它应该可以工作

【讨论】：

【解决方案2】：

似乎原因在于其他一些字体规则。最后，发现“line-height”规则使 font-size 在 Opera 和 Chrome 浏览器中不起作用。我的意思是复杂的结构与问题无关。

a.aBtn span.navDescr, a.aBtn span.navDescr p {
    font-family : "Open Sans", sans-serif !important;
    font-size : $aBtnFontSize !important;
    text-align: right;
    text-align-last:left;
    font-weight:normal;
    font-variant: normal;
    font-style:normal;
    //font_size : 3rem !important;
    // line-height : 1.5; //opera ignores : MAKES THIS ERROR 
    font-stretch: normal; 
    font-size-adjust:1; 
}

【讨论】：