userContent.css在Firefox中获取固定宽度的字体
[英]userContent.css to get fixed width font in firefox
问题描述
I am trying to get a fixed-width monospace font in gmail's new compose feature in firefox using a bit of css in userContent.css. 
我正在尝试使用userContent.css中的一些CSS在Firefox中gmail的新撰写功能中获得固定宽度的等宽字体。 Something like the following used to do the trick for me: 像下面这样的东西可以帮我解决问题：
@-moz-document domain(mail.google.com)
{
.ii, .Ak, .editable, .LW-avf
{
font-family: monospace !important;
font-size: 100% !important;
}
}
but it no longer works. 但它不再起作用。 Using the inspect element in firefox I see that the message is in something like: 使用firefox中的inspect元素，我看到消息类似于：
<body id=":di" class="editable LW-avf"
Is there something I am missing here? 我在这里缺少什么吗？ Why is a compose window not monospace if it is in class editable and LW-avf ? 如果compose窗口在类editable和LW-avf为什么它不是monospace ？
3 个解决方案
解决方案1
2 2013-10-25 22:08:13
I guessed that the iframe will not have any domain associated with it. 我猜想iframe不会有任何关联的域。 This seems to work for viewing and composing messages: 这似乎适用于查看和编写消息：
@-moz-document domain(mail.google.com) {
.gs .ii {
font-family: monospace !important;
font-size: 100% !important;
}
}
@-moz-document domain() {
.editable.LW-avf {
font-family: monospace !important;
font-size: 100% !important;
}
}
解决方案2
1 已采纳 2013-08-28 22:31:13
After taking a closer look at the gmail html, it looks like they are using an iframe with the html explicitly embedded... I have never seen this before. 在仔细研究了gmail html之后，看来他们正在使用显式嵌入html的iframe ...我以前从未见过。 Something like: 就像是：
<html>
<body>
<iframe>
#document
<!DOCTYPE html>
<html>
<body id=":di" class="editable LW-avf">
...
</body>
</html>
</iframe>
</body>
</html>
Presumably, the @-moz-document domain(mail.google.com) doesn't match the url for the page in the iframe (not sure what the URL would even be). 大概是@-moz-document domain(mail.google.com)与iframe中的网页的网址不匹配（不确定该网址是什么）。
If I don't match the url then it works fine. 如果我与网址不匹配，则可以正常工作。 Of course, now the style will be applied to any page with a class named editable . 当然，现在该样式将应用于名为editable的类的任何页面。
I may take this up with the mozilla developers when I find time. 我有时间的时候可以和mozilla开发人员联系。
解决方案3
0 2013-08-28 22:17:44
Interesting, but can't check the specifics as I dropped GMail some time ago (google was getting too freaky with pushing social networking...) 有趣，但由于我前一段时间放下GMail而无法检查具体信息（Google过于推崇社交网络了……）
http://www.w3.org/TR/CSS2/cascade.html#used-value http://www.w3.org/TR/CSS2/cascade.html#used-value
On the cascade order it says that Author mode trumps user mode. 按照级联顺序，它说作者模式胜过用户模式。 Unless user !important. 除非用户重要！ Which you are using. 您正在使用哪个。
http://www.w3.org/TR/CSS2/cascade.html#specificity http://www.w3.org/TR/CSS2/cascade.html#specificity
And here it says that the more specific gets applied. 这里说的是更具体的应用。
for example: 例如：
div#d.bclass { color: green; }
.aclass { color: red; }
<div id=d class="aclass bclass">hello world</div>
The div will be green all day long. div整天都是绿色的。 But I bet you already know that. 但是我敢打赌你已经知道了。
What may be happening, is that the browser is choosing some author rule that has much more specificity than yours. 可能发生的情况是，浏览器选择的某些作者规则比您的规则更具特异性。 which is a bug...Can you look at the Inspector and see where the computed font comes from? 这是一个错误...您可以查看检查器，看看计算出的字体来自何处？
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.