1

我想更改标签中的字体大小和粗细。我确实在 Stack Overflow 上找到了这个： StackOverflow 文章

然而，它似乎并没有完全回答这个问题，或者我没有得到一些东西。

考虑以下代码：

package com.mycompany.project.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Label;

/**
 * Entry point classes define <code>onModuleLoad()</code>.
 */
public class StyleTest implements EntryPoint
{
    private final Label lblATestLabel = new Label( "A Test Label" );

    public void onModuleLoad()
    {
        RootPanel rootPanel = RootPanel.get();
        lblATestLabel.setStyleName( "gwt-Label.TestStyle" );

        rootPanel.add( lblATestLabel, 204, 187 );
        lblATestLabel.setSize( "73px", "32px" );

        HTML hlabel = new HTML();
        hlabel.setStyleName("gwt-Label.TestStyle");
        hlabel.setHTML("Brown <span class=\"brown\">fox</span>");

        rootPanel.add(hlabel, 42, 36);
        hlabel.setSize("335px", "41px");
    }
}

StyleTest.css 底部的这种样式：

.gwt-Label.TestStyle {
    color: Green;
    vertical-align: middle;
}

我的期望是我的文本将垂直居中并呈绿色。结果根本没有变化。我可以设置任何我想要的样式，并且标签或 HTML 标签都没有变化。一切看起来都很正常，我做错了什么？

4

1 回答 1

1

setStyleName设置小部件元素的class属性（实际上是className属性，但这是等价的）；solblATestLabel.setStyleName("gwt-Label.TestStyle")等同于<div class="gwtLabel.TestStyle">在 HTML 中具有 a ，即具有单个类gwt-Label.TestStyle(class=""是空格分隔的) 的元素。

另一方面，.gwt-Label.TestStyle作为 CSS 样式表中的选择器，将匹配具有gwt-label和TestStyle类的任何元素；这将是一个元素，例如<div class="gwt-Label TestStyle">（记住：class=""是空格分隔的）

因此，根据您的需要，修复您的选择器（.gwt-Label\.TestStyle，可能不适用于所有浏览器），重命名您的类（例如gwt-Label-TestStyle）或将一个类添加到现有的（对于Label小部件）gwt-Label一个（lblATestLabel.addStyleName("TestStyle")）

于 2013-01-30T14:59:11.067 回答