Theme not working for Button

问题

I started playing with themes. I was able so create CSS and associated the CSS to various table elements. Works fine.

Now I am trying to do the same with a button. But it does not seem to work. If I apply the styleclass right to the button then it works.

<theme extends="oneuiv2.1"> 

<resource>
    <content-type>text/css</content-type>
    <href>app.css</href>
</resource>

<resource>
    <content-type>text/css</content-type>
    <href>viewpicklistCC.css</href>
</resource>


<control>
    <name>Button</name>
    <property>
        <name>styleClass</name>
        <value>MyButton</value>
    </property>
</control>



<control>
    <name>HtmlTable</name>
    <property>
        <name>styleClass</name>
        <value>PNCTable</value>
    </property>
</control>

<control>
    <name>HtmlTd</name>
    <property>
        <name>styleClass</name>
        <value>PNCTableCell</value>
    </property>
</control>


</theme>


.MyButton {
width:179.0px;
font-family:Arial,sans-serif;
font-size:18pt;
color:rgb(255,128,0);
font-weight:bold
}

回答1:

In a theme you need to use the theme id of a control in order to target it. This is not the same as the CSS style class.

You can set the theme id manually on a control (in Style - Theme, or in All properties - Style - Theme id) and then target the control by referring to this theme id.

Or you can use the default theme id for a control. The XPageswiki contains a list of default theme ids for core controls: http://xpageswiki.com/web/youatnotes/wiki-xpages.nsf/dx/Work_with_themes#themeID+values+for+core+controls

So in your case you need to use one of the following theme ids in order to target your button:

Button: Button.Command
Button with type=submit: Button.Submit
Button with type=cancel: Button.Cancel

来源：https://stackoverflow.com/questions/12622480/theme-not-working-for-button

标签

xpages