internet-explorer – GWT默认样式IE字体大小

2019年7月29日 179次阅读

我正在使用标准的GWT(2.0.1)来制作一个互联网应用程序,我有这个奇怪的问题与巨大的字体(编辑：好,比正常大)与IE 7&中的默认样式. 8,FF,Chrome和Safari正确显示字体.起初我认为它一定是我的错误(我使用UiBinder与一些自定义的CSS)但后来我注意到在GWT展示网站上各种小部件字体也太大了.有任何想法吗？ 最佳答案 这是由于IE默认字体大小渲染,与GWT无关,而是与CSS样式无关.

您可以确保字体在多个浏览器上使用类似的CSS(例如)：

*
{
    font-family: Arial, sans-serif;
    font-size: 12pt;    
}

body, table td, a, div, .p, pre 
{
    font-family: Arial, sans-serif;
    font-size: 12pt;
}

编辑：

为了确保所有小部件“获得”这种新样式,您需要以下列方式将CSS文件放在* .gwt.xml文件中(行的顺序很重要)：

<inherits name='com.google.gwt.user.theme.standard.Standard' />
<stylesheet src="MyNewAndImprovedStyle.css" />

不要把它放在HTML页面中！

这将确保您的样式覆盖窗口小部件样式.

PS：您可以手动覆盖一些小部件样式(为此我有一个GwtOverride.css)…请参阅片段：

.gwt-TextBox,.gwt-PasswordTextBox,.gwt-DateBox
{
    border: 1px solid #BDBDBD;
    padding: 2px;
    background-color: #FFFCDA;
}


.gwt-ListBox 
{
    font-family: Arial, sans-serif;
    font-size: 12px;    
    background-color: #FFFCDA;
}


/* make dialog slick and nice */
.gwt-DialogBox .dialogContent 
{
    margin: 5px;
}

.gwt-DialogBox .Caption 
{
    background: #99B4CC;
    border-top: 2px solid #99B4CC;
    border-bottom: 1px solid gray;

    font-size: 110%;
    font-weight: bold;
    white-space: nowrap;
}
点赞