Jskad/extensions/calpa/Docs/html/guide-Forms-style.html
2003-07-05 22:13:17 +00:00

188 lines
7.1 KiB
HTML

<HTML>
<BODY bgcolor=ffffff>
<P>
<TABLE width=100% cellspacing=0 cellpadding=0>
<TR>
<TD>
<FONT size=-1><B>CalHTMLPane v2.0 Guide</B></FONT>
</TD>
<TD align=right>
<FONT size=-1><B>Example Tag Usage</B></FONT>
</TD>
</TR>
</TABLE>
<HR width=100% size=1 color=black>
<P>
<FONT size=+1><B>2: Forms</B></FONT>
<P>
<BLOCKQUOTE>
<P>
<B>Attr: style</B><BR>
<P>
<TABLE border align=center bgcolor=ffffff cellpadding=6 width=100%>
<TR>
<TD colspan=2>
<B>Use Within:</B><BR>
&lt;INPUT&gt; &lt;TEXTAREA&gt;, &lt;SELECT&gt;, &lt;BUTTON&gt;
</TD>
</TR>
<TR>
<TD colspan=2>
<B>Arguments:</B> lookandfeel &#124; threedee &#124; flush
</TD>
</TR>
<TR>
<TD colspan=2>
<B>Synopsis:</B><BR>
Certain Swing Look & Feel controls do not render well within HTML documents
due to default color, sizing, opacity and border settings on the component.
The CalHTMLPane supports two additional rendering styles: <B>threedee</B>
and <B>flush</B> which will give consistent rendering irrespective of the
installed Look & Feel.
<P>Note that styles can be freely mixed within a document.
<BR><BR>
</TD>
</TR>
<TR><TH colspan=2>Examples of THREEDEE style form rendering</TD></TR>
<TR><TD>
<table align=center frame=border border=4 xbgcolor=teal bgcolor=ffffee bordercolor=maroon rules=none cellpadding=3>
<tr><td>
<table cellpadding=3>
<tr><th colspan=2><U>Personal Details</U></td></tr>
<tr><td align=right>Your name</td><td width=150><INPUT style=threedee type=text bordercolordark=aaaa77 bordercolorlight=cccc99></td></tr>
<tr><td align=right valign=top>Address</td><td><TEXTAREA rows=4 style=threedee bordercolordark=aaaa77 bordercolorlight=cccc99></TEXTAREA></td></tr>
<tr><td align=right>Zip Code</td><td><INPUT style=threedee type=text bordercolordark=aaaa77 bordercolorlight=cccc99></td></tr>
<tr><td align=right>Email address</td><td><INPUT style=threedee type=text bordercolordark=aaaa77 bordercolorlight=cccc99></td></tr>
<tr><td align=right colspan=2>
<BUTTON bgcolor=cccc99 bordercolorlight=eeeebb marginheight=1 type=button style=threedee>
<FONT face=Helvetica size=-2 color=maroon><B>Submit Details</B></FONT>
</BUTTON>
</td></tr>
</table>
</td></tr>
</table>
</TD>
<TD>
<table align=center frame=border border=4 bgcolor=teal bordercolor=maroon rules=none cellpadding=3>
<tr><td>
<table cellpadding=3>
<tr><th colspan=2><U><FONT color=cccc99>Personal Details</FONT></U></td></tr>
<tr><td align=right><FONT color=cccc99>Your name</FONT></td><td width=150><INPUT style=threedee type=text bgcolor=teal></td></tr>
<tr><td align=right valign=top><FONT color=cccc99>Address</FONT></TD><td><TEXTAREA rows=4 style=threedee bgcolor=teal></TEXTAREA></td></tr>
<tr><td align=right><FONT color=cccc99>Zip Code</FONT></td><td><INPUT style=threedee type=text bgcolor=teal></td></tr>
<tr><td align=right><FONT color=cccc99>Email address</FONT></td><td><INPUT style=threedee type=text bgcolor=teal></td></tr>
<tr><td align=right colspan=2>
<BUTTON bgcolor=cccc99 marginheight=1 type=button style=threedee>
<FONT face=Helvetica size=-2 color=maroon><B>Submit Details</B></FONT>
</BUTTON>
</td></tr>
</table>
</td></tr>
</table>
</TD>
</TR>
<TR><TH colspan=2>Examples of FLUSH style form rendering</TD></TR>
<TR><TD>
<table align=center frame=border border=4 bgcolor=ffffee bordercolor=maroon rules=none cellpadding=3>
<tr><td>
<table cellpadding=3>
<tr><th colspan=2><U>Personal Details</U></td></tr>
<tr><td align=right>Your name</td><td width=150><INPUT style=flush type=text></td></tr>
<tr><td align=right valign=top>Address</td><td><TEXTAREA rows=4 style=flush></TEXTAREA></td></tr>
<tr><td align=right>Zip Code</td><td><INPUT style=flush type=text></TD></TR>
<tr><td align=right>Email address</td><td><INPUT style=flush type=text></td></tr>
<tr><td align=right colspan=2>
<button bgcolor=cccc99 marginheight=1 type=button style=flush>
<FONT face=Helvetica size=-2 color=maroon><B>Submit Details</B></FONT>
</button>
</td></tr>
</table>
</td></tr>
</table>
</TD>
<TD>
<table align=center frame=border border=4 bgcolor=teal bordercolor=maroon rules=none cellpadding=3>
<tr><td>
<table cellpadding=3>
<tr><th colspan=2><U><FONT color=cccc99>Personal Details</FONT></U></td></tr>
<tr><td align=right><FONT color=cccc99>Your name</FONT></td><td width=150><INPUT style=flush type=text></td></tr>
<tr><td align=right valign=top><FONT color=cccc99>Address</FONT></td><td><TEXTAREA rows=4 style=flush></TEXTAREA></TD></TR>
<tr><td align=right><FONT color=cccc99>Zip Code</FONT></td><td><INPUT style=flush type=text></td></tr>
<tr><td align=right><FONT color=cccc99>Email address</FONT></td><td><INPUT style=flush type=text></td></tr>
<tr><td align=right colspan=2>
<BUTTON bgcolor=cccc99 marginheight=1 type=button style=flush>
<FONT face=Helvetica size=-2 color=maroon><B>Submit Details</B></FONT>
</BUTTON>
</td></tr>
</table>
</td></tr>
</table>
</TD></TR>
<TR><TH colspan=2>Examples of LOOKANDFEEL style form rendering</TD></TR>
<TR><TD>
<table align=center frame=border border=4 bgcolor=ffffee bordercolor=maroon rules=none cellpadding=3>
<tr><td>
<table cellpadding=3>
<tr><th colspan=2><U>Personal Details</U></td></tr>
<tr><td align=right>Your name</td><td width=150><INPUT style=lookandfeel type=text size=15></td></tr>
<tr><td align=right valign=top>Address</td><td><TEXTAREA rows=4 cols=15 style=lookandfeel></TEXTAREA></td></tr>
<tr><td align=right>Zip Code</td><td><INPUT style=lookandfeel type=text size=15></TD></TR>
<tr><td align=right>Email address</td><td><INPUT style=lookandfeel type=text size=15></td></tr>
<tr><td align=right colspan=2>
<button bgcolor=cccc99 marginheight=1 type=button style=lookandfeel>
<FONT face=Helvetica size=-2 color=maroon><B>Submit Details</B></FONT>
</button>
</td></tr>
</table>
</td></tr>
</table>
</TD>
<TD>
<table align=center frame=border border=4 bgcolor=teal bordercolor=maroon rules=none cellpadding=3>
<tr><td>
<table cellpadding=3>
<tr><th colspan=2><U><FONT color=cccc99>Personal Details</FONT></U></td></tr>
<tr><td align=right><FONT color=cccc99>Your name</FONT></td><td width=150><INPUT size=15 style=lookandfeel type=text></td></tr>
<tr><td align=right valign=top><FONT color=cccc99>Address</FONT></td><td><TEXTAREA rows=4 cols=15 style=lookandfeel></TEXTAREA></TD></TR>
<tr><td align=right><FONT color=cccc99>Zip Code</FONT></td><td><INPUT style=lookandfeel size=15 type=text></td></tr>
<tr><td align=right><FONT color=cccc99>Email address</FONT></td><td><INPUT style=lookandfeel size=15 type=text></td></tr>
<tr><td align=right colspan=2>
<BUTTON bgcolor=cccc99 marginheight=1 type=button style=lookandfeel>
<FONT face=Helvetica size=-2 color=maroon><B>Submit Details</B></FONT>
</BUTTON>
</td></tr>
</table>
</td></tr>
</table>
</TD></TR>
</TABLE>
</BLOCKQUOTE>
<TABLE align=center width=50%>
<TR>
<TD align=center colspan=2>
<A href="../CalGuide.html">Guide Index</A> &nbsp;&#124;
<A href="../javadoc/overview-tree.html">&nbsp;JavaDoc</A> &nbsp;&#124;
<A href="guide-Tables-widths.html">&nbsp;Previous</A> &nbsp;&#124;
<A href="guide-Forms-color.html">&nbsp;Next</A>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>