Question

我使用标准的GWT CSS +我自己的CSS文件，字体大小设置为80％。它适用于除IE以外的所有浏览器，其中字体很大。巨大的将更像它。 :-)

这是我的CSS声明：

  body,html {
    font-family: Arial, sans-serif;
    font-size: 80%;
  }

我如何实现这一点，以便IE遵守？

丹尼尔

Answer 1

font-size: 80% !important;

这可能是一种可行的方法，但它并没有真正解决问题的根源。 GWT CSS是什么样的？

我猜你在某处遇到了CSS冲突。如上所示，您的CSS规则没有GWT CSS中的规则那么重要。请查看此网站：http://css-tricks.com/specifics-on-css-specificity/

这是一篇非常好的文章，可以帮助澄清一些CSS冲突的根本原因。当我第一次发现它时，这个网站谈论的公式真的让我大开眼界（公式，而不是文章）。

基本上，您为CSS中的每个规则添加“分数”。得分最高的规则获胜并获得元素的样式。

每个ID值100
每个CLASS值10

每个ELEMENT值1个

html body{font-size: 80%;} /* worth 2 */
body{font-size: 70%;} /* worth 1 */
body#body-id{font-size: 50%;} /* worth 101 */
body.body-class{font-size: 90%;} /* worth 11 */
#body-id{font-size: 60%;} /* worth 100 */

正文的字体大小为50％。

Answer 2

来自W3Schools：

适用于所有浏览器的解决方案是为body元素设置默认的字体大小百分比：

body {font-size:100%}
h1 {font-size:2.5em}
h2 {font-size:1.875em}
p {font-size:0.875em}

我们的代码现在效果很好！它在所有浏览器中显示相同的文本大小，并允许所有浏览器缩放或调整文本大小！

换句话说，将正文字体大小设置为百分比，然后将其内部元素的字体大小设置为特定数量，使用ems作为单位。这将解决多个IE问题，包括您遇到的问题以及放大和缩小时出现的问题。

Answer 3

我建议将生成的css文件用于您用于GWT的任何主题，并创建一个您自己引用的副本。

您可以更好地控制页面布局，而无需在辅助样式表上使用！important。

如何在GWT中修复IE字体庞大的大小

3 个答案: