tag:blogger.com,1999:blog-57511734109934177642024-03-05T14:38:17.962+08:00Hello WorldYour online Visual Basic and Java homework helpEthelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.comBlogger47125tag:blogger.com,1999:blog-5751173410993417764.post-51917271724487493192012-09-03T23:58:00.000+08:002012-09-03T23:58:00.209+08:00AttributesThe most common attributes are as follows...<br />
<br />
<br />
*<table class="standard-table" style="background-color: white; border-collapse: collapse; border-spacing: 0px; border: 1px solid rgb(187, 187, 187); color: #333333; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Lucida, Arial, Helvetica, sans-serif; line-height: 22px; margin: 0px 0px 1.286em;"><thead>
<tr><th style="background-color: #eeeeee; border: 1px solid rgb(187, 187, 187); font-family: Georgia, Times, 'Times New Roman', serif; font-style: inherit; padding: 0px 5px; text-align: left;">Attribute Name</th><th style="background-color: #eeeeee; border: 1px solid rgb(187, 187, 187); font-family: Georgia, Times, 'Times New Roman', serif; font-style: inherit; padding: 0px 5px; text-align: left;">Elements</th><th style="background-color: #eeeeee; border: 1px solid rgb(187, 187, 187); font-family: Georgia, Times, 'Times New Roman', serif; font-style: inherit; padding: 0px 5px; text-align: left;">Description</th></tr>
</thead><tbody>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">align</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/applet" rel="custom" style="color: #6699cc; text-decoration: none;"><applet></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/caption" rel="custom" style="color: #6699cc; text-decoration: none;"><caption></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/col" rel="custom" style="color: #6699cc; text-decoration: none;"><col></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/colgroup" rel="custom" style="color: #6699cc; text-decoration: none;"><colgroup></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/hr" rel="custom" style="color: #6699cc; text-decoration: none;"><hr></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/iframe" rel="custom" style="color: #6699cc; text-decoration: none;"><iframe></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/img" rel="custom" style="color: #6699cc; text-decoration: none;"><img></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/table" rel="custom" style="color: #6699cc; text-decoration: none;"><table></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/tbody" rel="custom" style="color: #6699cc; text-decoration: none;"><tbody></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/td" rel="custom" style="color: #6699cc; text-decoration: none;"><td></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/tfoot" rel="custom" style="color: #6699cc; text-decoration: none;"><tfoot></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/th" rel="custom" style="color: #6699cc; text-decoration: none;"><th></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/thead" rel="custom" style="color: #6699cc; text-decoration: none;"><thead></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/tr" rel="custom" style="color: #6699cc; text-decoration: none;"><tr></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Specifies the horizontal alignment of the element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">alt</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><div style="margin-bottom: 1.286em; padding: 0px;">
<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/applet" rel="custom" style="color: #6699cc; text-decoration: none;"><applet></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/area" rel="custom" style="color: #6699cc; text-decoration: none;"><area></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/img" rel="custom" style="color: #6699cc; text-decoration: none;"><img></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code></div>
</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Alternative text in case an image can't be displayed.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">autoplay</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/audio" rel="custom" style="color: #6699cc; text-decoration: none;"><audio></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/video" rel="custom" style="color: #6699cc; text-decoration: none;"><video></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">The audio or video should play as soon as possible.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">bgcolor</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/body" rel="custom" style="color: #6699cc; text-decoration: none;"><body></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/col" rel="custom" style="color: #6699cc; text-decoration: none;"><col></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/colgroup" rel="custom" style="color: #6699cc; text-decoration: none;"><colgroup></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/marquee" rel="custom" style="color: #6699cc; text-decoration: none;"><marquee></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/table" rel="custom" style="color: #6699cc; text-decoration: none;"><table></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/tbody" rel="custom" style="color: #6699cc; text-decoration: none;"><tbody></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/tfoot" rel="custom" style="color: #6699cc; text-decoration: none;"><tfoot></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/td" rel="custom" style="color: #6699cc; text-decoration: none;"><td></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/th" rel="custom" style="color: #6699cc; text-decoration: none;"><th></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/tr" rel="custom" style="color: #6699cc; text-decoration: none;"><tr></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><div style="margin-bottom: 1.286em; padding: 0px;">
Background color of the element.</div>
<div style="margin-bottom: 1.286em; padding: 0px;">
Note: This is a legacy attribute. Please use the CSS <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/CSS/background-color" rel="custom" style="color: #6699cc; text-decoration: none;">background-color</a></code> property instead.</div>
</td></tr>
</tbody><tbody>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">border</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/img" rel="custom" style="color: #6699cc; text-decoration: none;"><img></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/object" rel="custom" style="color: #6699cc; text-decoration: none;"><object></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/table" rel="custom" style="color: #6699cc; text-decoration: none;"><table></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><div style="margin-bottom: 1.286em; padding: 0px;">
The border width.</div>
<div style="margin-bottom: 1.286em; padding: 0px;">
Note: This is a legacy attribute. Please use the CSS <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/CSS/border" rel="custom" style="color: #6699cc; text-decoration: none;">border</a></code> property instead.</div>
</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">checked</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/command" rel="custom" style="color: #6699cc; text-decoration: none;"><command></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates whether the element should be checked on page load.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">cite</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/blockquote" rel="custom" style="color: #6699cc; text-decoration: none;"><blockquote></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/del" rel="custom" style="color: #6699cc; text-decoration: none;"><del></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/ins" rel="custom" style="color: #6699cc; text-decoration: none;"><ins></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/q" rel="custom" style="color: #6699cc; text-decoration: none;"><q></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Contains a URI which points to the source of the quote or change.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">class</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><a href="https://developer.mozilla.org/en/HTML/Global_attributes" rel="internal" style="color: #6699cc; text-decoration: none;" title="en/HTML/Global attributes">Global attribute</a></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Often used with CSS to style elements with common properties.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">code</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/applet" rel="custom" style="color: #6699cc; text-decoration: none;"><applet></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Specifies the URL of the applet's class file to be loaded and executed.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">color</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/basefont" rel="custom" style="color: #6699cc; text-decoration: none;"><basefont></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/font" rel="custom" style="color: #6699cc; text-decoration: none;"><font></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/hr" rel="custom" style="color: #6699cc; text-decoration: none;"><hr></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><div style="margin-bottom: 1.286em; padding: 0px;">
This attribute sets the text color using either a named color or a color specified in the hexadecimal #RRGGBB format.</div>
<div style="margin-bottom: 1.286em; padding: 0px;">
Note: This is a legacy attribute. Please use the CSS <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/CSS/color" rel="custom" style="color: #6699cc; text-decoration: none;">color</a></code> property instead.</div>
</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">cols</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the number of columns in a textarea.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">colspan</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/td" rel="custom" style="color: #6699cc; text-decoration: none;"><td></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/th" rel="custom" style="color: #6699cc; text-decoration: none;"><th></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">The colspan attribute defines the number of columns a cell should span.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">content</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meta" rel="custom" style="color: #6699cc; text-decoration: none;"><meta></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">A value associated with <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">http-equiv</code> or <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">name</code>depending on the context.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">dir</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><a href="https://developer.mozilla.org/en/HTML/Global_attributes" rel="internal" style="color: #6699cc; text-decoration: none;" title="en/HTML/Global attributes">Global attribute</a></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">dirname</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"></td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">disabled</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/button" rel="custom" style="color: #6699cc; text-decoration: none;"><button></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/command" rel="custom" style="color: #6699cc; text-decoration: none;"><command></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/fieldset" rel="custom" style="color: #6699cc; text-decoration: none;"><fieldset></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/keygen" rel="custom" style="color: #6699cc; text-decoration: none;"><keygen></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/optgroup" rel="custom" style="color: #6699cc; text-decoration: none;"><optgroup></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/option" rel="custom" style="color: #6699cc; text-decoration: none;"><option></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/select" rel="custom" style="color: #6699cc; text-decoration: none;"><select></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates whether the user can interact with the element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">form</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/button" rel="custom" style="color: #6699cc; text-decoration: none;"><button></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/fieldset" rel="custom" style="color: #6699cc; text-decoration: none;"><fieldset></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/keygen" rel="custom" style="color: #6699cc; text-decoration: none;"><keygen></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/label" rel="custom" style="color: #6699cc; text-decoration: none;"><label></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meter" rel="custom" style="color: #6699cc; text-decoration: none;"><meter></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/object" rel="custom" style="color: #6699cc; text-decoration: none;"><object></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/output" rel="custom" style="color: #6699cc; text-decoration: none;"><output></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/progress" rel="custom" style="color: #6699cc; text-decoration: none;"><progress></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/select" rel="custom" style="color: #6699cc; text-decoration: none;"><select></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates the form that is the owner of the element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">headers</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/td" rel="custom" style="color: #6699cc; text-decoration: none;"><td></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/th" rel="custom" style="color: #6699cc; text-decoration: none;"><th></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">IDs of the <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><th></code> elements which applies to this element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">height</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/canvas" rel="custom" style="color: #6699cc; text-decoration: none;"><canvas></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/embed" rel="custom" style="color: #6699cc; text-decoration: none;"><embed></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/iframe" rel="custom" style="color: #6699cc; text-decoration: none;"><iframe></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/img" rel="custom" style="color: #6699cc; text-decoration: none;"><img></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/object" rel="custom" style="color: #6699cc; text-decoration: none;"><object></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/video" rel="custom" style="color: #6699cc; text-decoration: none;"><video></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Note: In some instances, such as <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/div" rel="custom" style="color: #6699cc; text-decoration: none;"><div></a></code> , this is a legacy attribute, in which case the CSS <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/CSS/height" rel="custom" style="color: #6699cc; text-decoration: none;">height</a></code> property should be used instead. In other cases, such as <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/canvas" rel="custom" style="color: #6699cc; text-decoration: none;"><canvas></a></code> , the height must be specified with this attribute.</td></tr>
</tbody><tbody>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">href</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/a" rel="custom" style="color: #6699cc; text-decoration: none;"><a></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/area" rel="custom" style="color: #6699cc; text-decoration: none;"><area></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/base" rel="custom" style="color: #6699cc; text-decoration: none;"><base></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/link" rel="custom" style="color: #6699cc; text-decoration: none;"><link></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"> The URL of a linked resource.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">hreflang</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/a" rel="custom" style="color: #6699cc; text-decoration: none;"><a></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/area" rel="custom" style="color: #6699cc; text-decoration: none;"><area></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/link" rel="custom" style="color: #6699cc; text-decoration: none;"><link></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Specifies the language of the linked resource.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">list</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Identifies a list of pre-defined options to suggest to the user.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">loop</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/audio" rel="custom" style="color: #6699cc; text-decoration: none;"><audio></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/bgsound" rel="custom" style="color: #6699cc; text-decoration: none;"><bgsound></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/marquee" rel="custom" style="color: #6699cc; text-decoration: none;"><marquee></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/video" rel="custom" style="color: #6699cc; text-decoration: none;"><video></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates whether the media should start playing from the start when it's finished.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">low</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meter" rel="custom" style="color: #6699cc; text-decoration: none;"><meter></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates the upper bound of the lower range.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">manifest</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/html" rel="custom" style="color: #6699cc; text-decoration: none;"><html></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Specifies the URL of the document's cache manifest.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">max</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meter" rel="custom" style="color: #6699cc; text-decoration: none;"><meter></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/progress" rel="custom" style="color: #6699cc; text-decoration: none;"><progress></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates the maximum value allowed.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">maxlength</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the maximum number of characters allowed in the element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">media</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/a" rel="custom" style="color: #6699cc; text-decoration: none;"><a></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/area" rel="custom" style="color: #6699cc; text-decoration: none;"><area></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/link" rel="custom" style="color: #6699cc; text-decoration: none;"><link></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/source" rel="custom" style="color: #6699cc; text-decoration: none;"><source></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/style" rel="custom" style="color: #6699cc; text-decoration: none;"><style></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Specifies a hint of the media for which the linked resource was designed.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">method</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/form" rel="custom" style="color: #6699cc; text-decoration: none;"><form></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines which HTTP method to use when submitting the form. Can be GET (default) or POST.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">min</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meter" rel="custom" style="color: #6699cc; text-decoration: none;"><meter></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates the minimum value allowed.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">multiple</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/select" rel="custom" style="color: #6699cc; text-decoration: none;"><select></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates whether multiple values can be entered in an input of the type <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">email</code> or <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">file</code>.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">name</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/button" rel="custom" style="color: #6699cc; text-decoration: none;"><button></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/form" rel="custom" style="color: #6699cc; text-decoration: none;"><form></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/fieldset" rel="custom" style="color: #6699cc; text-decoration: none;"><fieldset></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/iframe" rel="custom" style="color: #6699cc; text-decoration: none;"><iframe></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/keygen" rel="custom" style="color: #6699cc; text-decoration: none;"><keygen></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/object" rel="custom" style="color: #6699cc; text-decoration: none;"><object></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/output" rel="custom" style="color: #6699cc; text-decoration: none;"><output></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/select" rel="custom" style="color: #6699cc; text-decoration: none;"><select></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/map" rel="custom" style="color: #6699cc; text-decoration: none;"><map></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meta" rel="custom" style="color: #6699cc; text-decoration: none;"><meta></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/param" rel="custom" style="color: #6699cc; text-decoration: none;"><param></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Name of the element. For example used by the server to identify the fields in form submits.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">placeholder</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Provides a hint to the user of what can be entered in the field.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">poster</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/video" rel="custom" style="color: #6699cc; text-decoration: none;"><video></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">A URL indicating a poster frame to show until the user plays or seeks.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">rel</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/a" rel="custom" style="color: #6699cc; text-decoration: none;"><a></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/area" rel="custom" style="color: #6699cc; text-decoration: none;"><area></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/link" rel="custom" style="color: #6699cc; text-decoration: none;"><link></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Specifies the relationship of the target object to the link object.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">required</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/select" rel="custom" style="color: #6699cc; text-decoration: none;"><select></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates whether this element is required to fill out or not.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">reversed</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/ol" rel="custom" style="color: #6699cc; text-decoration: none;"><ol></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Indicates whether the list should be displayed in a descending order instead of a ascending.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">rows</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/textarea" rel="custom" style="color: #6699cc; text-decoration: none;"><textarea></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the number of rows in a textarea.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">rowspan</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/td" rel="custom" style="color: #6699cc; text-decoration: none;"><td></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/th" rel="custom" style="color: #6699cc; text-decoration: none;"><th></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the number of rows a table cell should span over.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">selected</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/option" rel="custom" style="color: #6699cc; text-decoration: none;"><option></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines a value which will be selected on page load.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">size</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/select" rel="custom" style="color: #6699cc; text-decoration: none;"><select></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the width of the element (in pixels). If the element's <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">type</code> attribute is <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text</code> or<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">password</code> then it's the number of characters.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">span</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/col" rel="custom" style="color: #6699cc; text-decoration: none;"><col></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/colgroup" rel="custom" style="color: #6699cc; text-decoration: none;"><colgroup></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"></td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">src</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/audio" rel="custom" style="color: #6699cc; text-decoration: none;"><audio></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/embed" rel="custom" style="color: #6699cc; text-decoration: none;"><embed></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/iframe" rel="custom" style="color: #6699cc; text-decoration: none;"><iframe></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/img" rel="custom" style="color: #6699cc; text-decoration: none;"><img></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/script" rel="custom" style="color: #6699cc; text-decoration: none;"><script></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/source" rel="custom" style="color: #6699cc; text-decoration: none;"><source></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/track" rel="custom" style="color: #6699cc; text-decoration: none;"><track></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/video" rel="custom" style="color: #6699cc; text-decoration: none;"><video></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">The URL of the embeddable content.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">style</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><a href="https://developer.mozilla.org/en/HTML/Global_attributes" rel="internal" style="color: #6699cc; text-decoration: none;" title="en/HTML/Global attributes">Global attribute</a></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines CSS styles which will override styles previously set.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">tabindex</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><a href="https://developer.mozilla.org/en/HTML/Global_attributes" rel="internal" style="color: #6699cc; text-decoration: none;" title="en/HTML/Global attributes">Global attribute</a></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Overrides the browser's default tab order and follows the one specified instead.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">title</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><a href="https://developer.mozilla.org/en/HTML/Global_attributes" rel="internal" style="color: #6699cc; text-decoration: none;" title="en/HTML/Global attributes">Global attribute</a></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Text to be displayed in a tooltip when hovering over the element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">type</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/button" rel="custom" style="color: #6699cc; text-decoration: none;"><button></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/command" rel="custom" style="color: #6699cc; text-decoration: none;"><command></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/embed" rel="custom" style="color: #6699cc; text-decoration: none;"><embed></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/object" rel="custom" style="color: #6699cc; text-decoration: none;"><object></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/script" rel="custom" style="color: #6699cc; text-decoration: none;"><script></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/source" rel="custom" style="color: #6699cc; text-decoration: none;"><source></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/style" rel="custom" style="color: #6699cc; text-decoration: none;"><style></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/menu" rel="custom" style="color: #6699cc; text-decoration: none;"><menu></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines the type of the element.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">value</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/button" rel="custom" style="color: #6699cc; text-decoration: none;"><button></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/option" rel="custom" style="color: #6699cc; text-decoration: none;"><option></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/li" rel="custom" style="color: #6699cc; text-decoration: none;"><li></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/meter" rel="custom" style="color: #6699cc; text-decoration: none;"><meter></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/progress" rel="custom" style="color: #6699cc; text-decoration: none;"><progress></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/param" rel="custom" style="color: #6699cc; text-decoration: none;"><param></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Defines a default value which will be displayed in the element on page load.</td></tr>
<tr><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">width</td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;"><code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/canvas" rel="custom" style="color: #6699cc; text-decoration: none;"><canvas></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/embed" rel="custom" style="color: #6699cc; text-decoration: none;"><embed></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/iframe" rel="custom" style="color: #6699cc; text-decoration: none;"><iframe></a></code>, <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/img" rel="custom" style="color: #6699cc; text-decoration: none;"><img></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/input" rel="custom" style="color: #6699cc; text-decoration: none;"><input></a></code> , <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/object" rel="custom" style="color: #6699cc; text-decoration: none;"><object></a></code> ,<code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/video" rel="custom" style="color: #6699cc; text-decoration: none;"><video></a></code></td><td style="border: 1px solid rgb(204, 204, 204); padding: 5px; text-align: left; vertical-align: top;">Note: In some instances, such as <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/div" rel="custom" style="color: #6699cc; text-decoration: none;"><div></a></code> , this is a legacy attribute, in which case the CSS <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/CSS/width" rel="custom" style="color: #6699cc; text-decoration: none;">width</a></code> property should be used instead. In other cases, such as <code style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"><a href="https://developer.mozilla.org/en/HTML/Element/canvas" rel="custom" style="color: #6699cc; text-decoration: none;"><canvas></a></code> , the width must be specified with this attribute.</td></tr>
</tbody></table>
<br />
<br />
<span style="font-size: xx-small;"><br /></span><br />
<span style="font-size: xx-small;">*thanks to <a href="https://developer.mozilla.org/en-US/">Mozilla Developer Network</a> for the attribute list</span>Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-10527265562936677532012-08-20T03:48:00.000+08:002012-08-20T03:48:00.246+08:00List of HTML ElementsAs promised, the list of the commonly-used HTML elements are as follows...<br />
<br />
<b><u>Head Section</u></b><br />
<br />
<ul type="*">
<li>TITLE - Document title</li>
<li>ISINDEX - Primitive search</li>
<li>META - Meta-information</li>
<li>LINK - Site structure</li>
<li>BASE - Document location</li>
<li>SCRIPT - Inline script</li>
<li>STYLE - Style information</li>
</ul>
<div>
<b><u>Body Section</u></b></div>
<div>
<b><u><br />
</u></b></div>
<br />
<ul>
<li>H1 - Level 1 header</li>
<li>H2 - Level 2 header</li>
<li>H3 - Level 3 header</li>
<li>H4 - Level 4 header</li>
<li>H5 - Level 5 header</li>
<li>H6 - Level 6 header</li>
<li>UL - Unordered list</li>
<li>OL - Ordered list</li>
<li>DIR - Directory list</li>
<li>MENU - Menu item list</li>
<li>LI - List item</li>
<li>DL - Definition list</li>
<li>DT - Definition term</li>
<li>DD- Definition</li>
<li>P - Paragraph</li>
<li>PRE - Preformatted text</li>
<li>BLOCKQUOTE - Large quotation</li>
<li>CENTER - Centered division</li>
<li>FORM - Input form</li>
<li>HR - Horizontal rule</li>
<li>TABLE - Tables</li>
<li>EM - Emphasized text</li>
<li>STRONG - Strongly emphasized</li>
<li>CITE - Short citation</li>
<li>I - Italics</li>
<li>B - Bold</li>
<li>U - Underline</li>
<li>STRIKE - Strikeout</li>
<li>BIG - Larger text</li>
<li>SMALL - Smaller text</li>
<li>SUB - Subscript</li>
<li>SUP - Superscript</li>
<li>INPUT - Input field, button, etc.</li>
<li>SELECT - Selection list</li>
<li>OPTION - Selection list option</li>
<li>TEXTAREA - Input area</li>
<li>CAPTION - Table caption</li>
<li>TR - Table row</li>
<li>TH - Header cell</li>
<li>TD - Table cell</li>
<li>A - Anchor</li>
<li>IMG - Image</li>
<li>FONT - Font modification</li>
<li>BR - Line break</li>
</ul>
<div>
<br /></div>
<div>
<br /></div>
<div>
PS</div>
<div>
<ul>
<li><b>NOT</b> all tags above have a closing tag.</li>
<li>Remember that each element are enclosed of brackets (<i><></i>), example, <em>Emphasize</em></li>
</ul>
</div>Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com1tag:blogger.com,1999:blog-5751173410993417764.post-36285241329206256992012-08-06T15:46:00.000+08:002012-08-06T15:46:00.087+08:00HTML Formatting TagsIn order to display a <b>bold</b> or <i>italic</i> text in HTML, we use the formatting tags.<br />
<br />
There are two types of tags:<br />
<br />
<ol>
<li><b><i>PHYSICAL tags</i></b></li>
<li><b><i>LOGICAL tags</i></b></li>
</ol>
<div>
As <a href="http://www.scriptingmaster.com/html/character-tags.asp" style="font-style: italic; font-weight: bold;">Scripting Master</a><i style="font-weight: bold;"> </i>describes the difference as follows...</div>
<div>
<blockquote class="tr_bq">
a <em>physical character tag</em> controls how the characters are formatted. For instance, you might display some characters as bold or italic. Listing 1 displays some common physical character tags. </blockquote>
<blockquote>
<table border="0" cellpadding="2" cellspacing="0" class="Table" style="background-color: #f7f7f7; color: black; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 13px; text-align: left;"><tbody>
<tr><th>HTML code</th><th>Output</th></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <b>bold</b></code></td><td>This is <b>bold</b></td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <big>big font</big></code></td><td>This is <big>big font</big></td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <i>italic</i></code></td><td>This is <i>italic</i></td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">Was <s>$50</s>; now $40</code></td><td>Was <strike>$50</strike>; now $40</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <small>small</small></code></td><td>This is <small>small</small></td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">H<sub>2</sub>O</code></td><td>H<sub>2</sub>O</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">May 5<sup>th</sup> 2005</code></td><td>May 5<sup>th</sup> 2005</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><tt>fixed-width font</tt></code></td><td><tt>fixed-width font</tt></td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <u>underlined</u></code></td><td>This is <u>underlined</u></td></tr>
</tbody></table>
</blockquote>
<blockquote class="tr_bq">
<span style="background-color: #f7f7f7; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 13px; line-height: 19px; text-align: left;">A </span><em style="background-color: #f7f7f7; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 13px; line-height: 19px; text-align: left;">logical character tag</em><span style="background-color: #f7f7f7; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 13px; line-height: 19px; text-align: left;"> describes how the text is being used, not necessarily how it is formatted. Listing 3 displays common examples logical character tags.</span> </blockquote>
<blockquote>
<table align="center" border="0" cellpadding="1" cellspacing="0" class="Table" style="background-color: #f7f7f7; color: black; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 13px; text-align: left;"><tbody>
<tr><th>HTML code</th><th>Output</th></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is used for a short <cite>quote</cite>.</code></td><td>This is used for a short <cite>quote</cite>.</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><code>y = m * x + b</code></code></td><td><kbd>y = m * x + b</kbd></td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><del>Deleted</del> text</code></td><td><del>Deleted</del> text</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><dfn>definition</dfn> text</code></td><td><dfn>definition</dfn> text</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <em> emphasized </em>.</code></td><td>This is <em>emphasized </em>.</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><ins>inserted</ins> text</code></td><td><ins>inserted</ins> text</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><kbd>code</kbd> sample</code></td><td><kbd>code</kbd> sample</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><samp>code</samp> sample</code></td><td><samp>code</samp> sample</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;">This is <strong>strong</strong>.</code></td><td>This is <strong>strong</strong>.</td></tr>
<tr valign="top"><td><code style="background-color: #ffffb7; color: #595900; font-family: 'Courier New', Courier, monospace; font-size: 12px; margin: 5px 0px 2px; padding: 0px 2px 0px 0px;"><var>program</var> variable</code></td><td><var>program</var> variable</td></tr>
</tbody></table>
<br /> </blockquote>
<blockquote>
</blockquote>
<blockquote>
</blockquote>
</div>Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-3846007445408913742012-07-23T03:38:00.000+08:002012-07-23T03:38:00.841+08:00HTML Paragraphs vs Line Break<br />
<b><br class="Apple-interchange-newline" />Paragraphs</b> are useful especially when features are posted. It is also very useful in understanding the written article of a webpage properly, like how News and Blog sites have been posting as their content.<br />
<br />
Paragraphs are another element of HTML that has an opening and closing tag. An opening tag, <i><p></i>, is declared when starting a new paragraph and a closing tag,<i></p></i>, is declared by ending the paragraph or before starting another paragraph.<br />
<br />
Most browsers, however, display a new paragraph even by without the end tag, but using the correct syntax is more recommended to provide error-free results.<br />
<br />
<b>Line Break</b> means a new line. A bit similar to a paragraph though a paragraph gives more space between the first paragraph between the second paragraph.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://uniquemethod.com/wp-content/uploads/wordpress-line-breaks-visual.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="240" src="http://uniquemethod.com/wp-content/uploads/wordpress-line-breaks-visual.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-size: xx-small;">photo by: Unique Method</span></td></tr>
</tbody></table>
<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<br class="Apple-interchange-newline" />Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-70104239343444153982012-07-09T03:20:00.000+08:002012-07-09T03:20:00.793+08:00HTML HeadingHTML <b>Headings</b> are used for Headings only. Headings have a start tag and an end tag. It is important to remember than web visitors read a web page's heading first.<br />
<br />
Headings are written as...<br />
<br />
<span style="font-family: Times, 'Times New Roman', serif;"><i><h1>This is an H1 Heading</h1></i></span><br />
<br />
Headings are defined through the use of <h1> to <h6> elements or tags. The smaller value of your heading is, the bigger size of your font is.<br />
<br />
Examples:<br />
<br />
<h1>
This is H1</h1>
<h2>
This is H2</h2>
<h3>
This is H3</h3>
<h4>
This is H4</h4>
<h5>
This is H5</h5>
<h6>
This is H6</h6>Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com1tag:blogger.com,1999:blog-5751173410993417764.post-38997871165038621612012-06-25T03:07:00.000+08:002012-06-25T03:07:00.462+08:00HTML Elements and AttributesAn <b>element</b> is everything from the start to the end tag. Some elements, however, have empty contents.<br />
<br />
<table class="reference" style="background-color: white; border-collapse: collapse; border: 1px solid rgb(195, 195, 195); color: black; font-family: verdana, helvetica, arial, sans-serif; font-size: 13px; width: 633px;"><tbody>
<tr><th style="background-color: #e5eecc; border: 1px solid rgb(195, 195, 195); padding: 3px; text-align: left; vertical-align: top;" width="34%">Start Tag</th><th style="background-color: #e5eecc; border: 1px solid rgb(195, 195, 195); padding: 3px; text-align: left; vertical-align: top;" width="34%">Content</th><th style="background-color: #e5eecc; border: 1px solid rgb(195, 195, 195); padding: 3px; text-align: left; vertical-align: top;" width="34%">End Tag</th></tr>
<tr><td style="border: 1px solid rgb(195, 195, 195); padding: 3px; vertical-align: top;"><b></td><td style="border: 1px solid rgb(195, 195, 195); padding: 3px; vertical-align: top;">Text are strong</td><td style="border: 1px solid rgb(195, 195, 195); padding: 3px; vertical-align: top;"></b></td></tr>
<tr><td style="border: 1px solid rgb(195, 195, 195); padding: 3px; vertical-align: top;"><br/></td><td style="border: 1px solid rgb(195, 195, 195); padding: 3px; vertical-align: top;"><br /></td><td style="border: 1px solid rgb(195, 195, 195); padding: 3px; vertical-align: top;"><br /></td></tr>
</tbody></table>
<br />
Some elements have <b>attributes.</b><br />
<b><br /></b><br />
An <i>attribute</i> can be identified within an element by finding the equal sign (<i>=</i>). Attributes give more information on HTML elements and are always introduced in the starting tag of an element.<br />
<br />
More on attributes on the next post.Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-22536892047284823702012-06-12T03:16:00.000+08:002012-06-12T03:16:00.811+08:00Introduction to Web<a href="http://icons.iconseeker.com/png/fullsize/summer-collection/web-1.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" height="200" src="http://icons.iconseeker.com/png/fullsize/summer-collection/web-1.png" width="200" /></a>A <b>website</b> is a set of <i>web pages</i> that contains content on either or both text, images and multimedia, and etc. A <b>Web Page</b> on the other hand, is a document created with HTML.<br />
<br />
<br />
There are two types of websites:<br />
<br />
<ol>
<li><i style="font-weight: bold;">DYNAMIC websites</i><b> </b></li>
<li><b><i>STATIC websites</i></b></li>
</ol>
<br />
<br />
A <i>dynamic </i>website has a <i>front and back end</i>. Visitors of the site can add changes to itself frequently and usually retrieves data from a database. <i>Blogger, Facebook and Twitter </i>are an example of famous dynamic websites.<br />
<br />
A <i>static </i>website is the simplest form of web programming and has not administrator page. It displays the same information to all the visitors and cannot be changed.<br />
<br />
<b>HTML </b>stands for <i>Hypertext Markup Language</i> and is the most common programming tool for the web.<br />
<br />
A <i>Markup</i> are keywords surrounded by brackets (<i>< ></i>), and can be referred as <i>HTML tags</i> or simply <i>tags.</i> Usually, <i>markups</i> come in pairs which has an opening tag, the first tag of the pair, and a closing tag, the last tag of the pair.<br />
<br />
Refer to next post for more of HTML.Ethelhttp://www.blogger.com/profile/03949911932387262829noreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-13440431313917429922011-08-03T10:06:00.000+08:002011-08-03T10:06:00.541+08:00Simple 'Try and Catch' Example<code><br />
import java.io.*;<br />
</code><br />
<code>public class TryCatchExample</code><br />
<code>{</code><br />
<code>public static void main (String args[]) throws IOException</code><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">BufferedReader HelloWorld = new BufferedReader(new InputStreamReader(System.in));</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">System.out.println("Enter A Number: ");</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">try</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">int GalaxyNumber = Integer.parseInt(HelloWorld.readLine());</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">catch </span><span class="Apple-style-span" style="font-family: monospace;">(NumberFormatException ShowError)</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">System.out.println("Enter A Number: ");</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<br />
you can also have...<br />
<br />
<br />
<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">catch (NumberFormatException ShowError)</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">System.out.println(ShowError);</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><code><br />
</code><br />
<br />
instead of...<br />
<br />
<br />
<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">catch </span><span class="Apple-style-span" style="font-family: monospace;">(NumberFormatException ShowError)</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">System.out.println("Enter A Number: ");</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;"><br />
</span></div><br />
... to know the error.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-56306439538400193032011-07-30T15:53:00.001+08:002011-07-30T15:53:00.287+08:00Try and Catch<blockquote><span class="Apple-style-span" style="font-size: large;"><b>Try - </b>Make an attempt or effort to do something<br />
<b>Catch - </b>Intercept and Hold</span></blockquote><br />
Syntax:<br />
<code><br />
try<br />
{<br />
statement(s);<br />
}<br />
<br />
catch (Exception Handler Tag)<br />
{<br />
statement(s);<br />
}<br />
</code><br />
<br />
The <i>try and catch </i> allows you to test a block of errors. Once it encounters a block of errors in the <i>try</i>, it passes it to the <i>tag</i>. A <i>tag</i> is a variable that hold the exception. The statements under the <i>catch </i>are to be executed once the <i>try</i> receives an error (it catches the errors from the try).<br />
<br />
<i>Exception Handler</i> is an exception. An exception an error. Famous exceptions are IOException and NumberFormatException.<br />
<br />
For an example of a <i>try and catch</i>, refer to the next post.Unknownnoreply@blogger.com1tag:blogger.com,1999:blog-5751173410993417764.post-53852892974167150512011-07-19T08:34:00.000+08:002011-07-19T08:34:01.387+08:00Creating a GUI of a Simple Calculator<center><img src="http://img.search.com/thumb/6/65/Calculator_Vista_Standard.png/250px-Calculator_Vista_Standard.png" /></center><br />
<br />
The image above is a simple calculator found in Windows; while the image below is a simplier version of calculator compared to the one above.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAKkI2MrAyzmgnTw7hz4Rw4BS1RTIxEeAvwHapj_OV4aNAAKuZy0efdv275Y8pvAuk3SF9cYZy-9jny5dFFI93vxTefQri3KzBVKsU9t8RM1_aFBAOvSfQpCuhiqFPeC2MJl_LZtb_pZwJ/s1600/hw2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAKkI2MrAyzmgnTw7hz4Rw4BS1RTIxEeAvwHapj_OV4aNAAKuZy0efdv275Y8pvAuk3SF9cYZy-9jny5dFFI93vxTefQri3KzBVKsU9t8RM1_aFBAOvSfQpCuhiqFPeC2MJl_LZtb_pZwJ/s1600/hw2.jpg" /></a></div><br />
And yes, it is created in Java. Try to create your own version of a Java Calculator using the simple operations. The code will be posted in a few days.<br />
<br />
PS<br />
Just the GUI. Never mind the functions yet.Unknownnoreply@blogger.com5tag:blogger.com,1999:blog-5751173410993417764.post-14747414952633446492011-07-14T20:18:00.000+08:002011-07-14T20:18:00.666+08:00Ways to Use InheritanceThere are two ways to use Inheritance in Java.<br />
<br />
1. Using the <i>Extend </i>keyword<br />
As you have learned from the previous lesson, the <i>extend </i>keyword is used in <a href="http://codegalaxy.blogspot.com/search/label/Method">Method</a> <a href="http://codegalaxy.blogspot.com/search/label/Overriding">Overriding</a>, which is a part of <a href="http://codegalaxy.blogspot.com/search/label/Polymorphism">Polymorphism</a>. We use it to refer the different methods and variables in a parent or super class that can be used in the parent of child class. Given the example from the previous post...<br />
<br />
<br />
<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code>class first</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code>{</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code>int number;</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code><br />
</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code>void Add()</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code>{</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><code>number=number+1;</code></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;"><br />
</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">void Subtract()</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">number=number-1;</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">class second extends first</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">void Add()</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">number=number*1;</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">void Divide()</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">number=number/1;</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">public class MClass</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">public static void main (String args[])</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">first one = new first();</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">one.Add();</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">one.Subtract();</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;"><br />
</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">second two = new second();</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">two.Add();</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">two.Divide()</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;"><br />
</span></div><br />
<br />
2. Constructor Method<br />
A constructor method is commonly used (beginners) in creating methods in a simple program. The constructor method uses parameters to connect values from the object class to the main class. For example, given a Sample Class and a Main Class...<br />
<br />
<code><br />
class Sample<br />
{<br />
void test()<br />
{<br />
System.out.println("Test");<br />
}<br />
}<br />
<br />
public class MainClass<br />
{<br />
public static void main (String args[])<br />
{<br />
Sample x = new Sample();<br />
}<br />
}</code><br />
<br />
The output will only display <i>Test.</i>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-23505324764003394382011-07-12T20:17:00.000+08:002011-07-12T20:17:01.682+08:00InheritanceIn Java, the following terms are often used:<br />
<br />
<ul><li>Super Class - the topmost part of the class</li>
<li>Parent Class - the class before the child class</li>
<li>Child Class - the last class in the program</li>
</ul><div>To understand fully, here's a sample of a family tree.</div><br />
<br />
<br />
<br />
<br />
<center><img height="289" src="http://www.tsac.co.uk/images/tutorial/tree.gif" width="400" /></center><br />
<br />
Obviously, the child (classes) are the following:<br />
<br />
<ul><li>Me</li>
<li>Brother</li>
<li>Sister</li>
<li>Cousin; and</li>
<li>OTHER Cousin</li>
</ul><div>The Parent Classes are:</div><div><ul><li>Mommy and Daddy Smith</li>
<li>Uncle and Aunt Trotter</li>
<li>Aunt and OTHER A.N</li>
</ul><div>The Super Class are:</div></div><div><ul><li>Grandad and Granny Jones</li>
<li>Great Grandad and Great Granny Bloggs</li>
</ul><div>However, Java does not support multiple inheritance. Java can only hold one Super Class, one Parent Class, and one Child Class.</div></div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-64715666076648199152011-07-10T20:08:00.004+08:002011-07-10T20:08:00.611+08:00GUI BasicsA <b>GUI</b> is an acronym of Graphical User Interface, and is sometimes pronounced as <i>Gooey</i>. Visual Basic has a very good example of GUI wherein you can draw your objects freely with the use of the mouse. However, in Java, you have to plot it point by point.<br />
<br />
The first thing in creating a GUI in Java is to use everything in the <i>swing</i> package and to override swing's JFrame by using the <i>extend</i> keyword.<br />
<br />
Our main goal in this lesson is to create a simple GUI of an ATM Machine with two labels and textboxes (Card Number and Pin), two buttons (OK and Cancel) and name it ATM.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjekpOzUis_EsiKRtshQ8azVZ1gBTfXIBId3erwKuOL19bnRq0zirTtFkyw8ymP1oLVj8zjXPnWiXzdXKGIF30uk2JEYcI9SBc0VC4BxAJZKg5jTyOiph69CD0WV76NYSBx5Q_kFt_zlXPu/s1600/ATML.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="162" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjekpOzUis_EsiKRtshQ8azVZ1gBTfXIBId3erwKuOL19bnRq0zirTtFkyw8ymP1oLVj8zjXPnWiXzdXKGIF30uk2JEYcI9SBc0VC4BxAJZKg5jTyOiph69CD0WV76NYSBx5Q_kFt_zlXPu/s400/ATML.jpg" width="400" /></a></div><br />
<br />
<center></center><br />
<br />
Below is the code with explanations...<br />
<br />
<code><br />
import javax.swing.*; //<i>use everything within the swing package</i><br />
public class CodeGalaxy extends JFrame //<i>overrides JFrame</i></code><code> {<br />
</code><br />
<code>JTextField txt1 = new JTextField(); //<i>JTextField is equivalent to a textbox</i><br />
JLabel CardN = new JLabel("Card Number: "); //<i>JLabel is equivalent to a label</i><br />
<br />
JTextField txt2 = new JTextField();<br />
JLabel PIN = new JLabel("Pin: "); <br />
<br />
JButton OKbtn = new JButton("OK"); //<i>JButton is equivalent to a command button</i><br />
JButton Can = new JButton("Cancel");<br />
<br />
<br />
public CodeGalaxy() //<i>constructor method with the same name of your class</i><br />
{<br />
<br />
//<i>shows the output of the Card Number</i><br />
<br />
</code><br />
<code>getContentPane().setLayout(null); </code><span class="Apple-style-span" style="font-family: monospace;">//<i>set to nothing / null </i></span><br />
<code> CardN.setBounds(70,10,90,10); //</code><code><i>setBounds defines the boundary of your object</i> </code><br />
<code>getContentPane().add(CardN);<br />
<br />
txt1.setBounds(150,10,150,18);<br />
getContentPane().add(txt1);<br />
<br />
//same flow of idea as to the Card Number//<br />
<br />
//shows the output of the PIN <br />
PIN.setBounds(70,30,80,10);<br />
getContentPane().add(PIN); <br />
<br />
txt2.setBounds(150,30,150,18);<br />
getContentPane().add(txt2);<br />
<br />
<br />
//shows Ok button<br />
OKbtn.setBounds(230,60,70,30);<br />
getContentPane().add(OKbtn);<br />
<br />
<br />
//shows Cancel button<br />
Can.setBounds(70,60,90,30);<br />
getContentPane().add(Can);<br />
<br />
<br />
setTitle("ATM"); //<i>sets the title as ATM</i><br />
setSize(400,130); //<i>sets the size</i><br />
setVisible(true); //<i>makes our ATM visible</i><br />
<br />
}<br />
<br />
public static void main (String args[])<br />
{<br />
CodeGalaxy x = new CodeGalaxy();<br />
}<br />
}</code><br />
<br />
<br />
Further explanation:<br />
<br />
<b>setBounds </b>syntax:<br />
<i>variable</i>.setBounds(<i>x-axis,y-axis,width,height</i>);<br />
<br />
<b>setSize</b> syntax:<br />
setSize(<i>width, height</i>);<br />
<br />
<br />
<b>public static void main (String args[])</b><br />
<b><span class="Apple-tab-span" style="white-space: pre;"> </span>{</b><br />
<b><span class="Apple-tab-span" style="white-space: pre;"> </span>Lab3 x = new Lab3();</b><br />
<b><span class="Apple-tab-span" style="white-space: pre;"> </span>}</b><br />
without the public static void main, our program will run invisibly.<br />
<br />
<b>JTextField txt1 = new JTextField();</b><br />
JTextField is a textbox with the variable name txt1<br />
<b><br />
</b><br />
<b>JLabel PIN = new JLabel("Pin: ");</b><br />
JLabel is a label with the variable name PIN with the caption as <i>Pin:</i><br />
<br />
<br />
<b>JButton Can = new JButton("Cancel");</b><br />
JButton is a command button with the variable name Can with the caption as <i>Cancel</i>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-12384013764931932232011-07-08T19:52:00.000+08:002011-06-30T20:40:13.663+08:00The 'extend' keyword<code><br />
class first<br />
</code><br />
<code>{</code><br />
<code>int number;</code><br />
<code><br />
</code><br />
<code>void Add()</code><br />
<code>{</code><br />
<code>number=number+1;</code><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">void Subtract()</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">number=number-1;</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">class second extends first</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">void Add()</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">number=number*1;</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">void Divide()</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">number=number/1;</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">public class MClass</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">public static void main (String args[])</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">first one = new first();</span><br />
<span class="Apple-style-span" style="font-family: monospace;">one.Add();</span><br />
<span class="Apple-style-span" style="font-family: monospace;">one.Subtract();</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">second two = new second();</span><br />
<span class="Apple-style-span" style="font-family: monospace;">two.Add();</span><br />
<span class="Apple-style-span" style="font-family: monospace;">two.Divide()</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<br />
Given the code above, <i>second extends first</i> where second inherits first's methods and variable. As you can see the variable in <i>class first </i> and <i>class second</i> is the same, which is <i>number</i>, though number is only declared in <i>class first.</i> <i>Class Second</i> overrides the <i>Add</i> method and added a <i>Divide</i> method.<br />
<br />
When <i>class second extends to first</i>, we call second as a <i>subclass</i> of first and first is the <i>superclass</i> of second. In java, two or more classes can inherit from the same parent class but a class can only have one parent.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-17936360526639149902011-07-06T19:30:00.000+08:002011-07-06T19:30:02.332+08:00Method OverridingLet's start with an example. If <i>Aphrodite Keys</i> is a famous celebrity, her mother, <i>Hera Keys</i> is also a famous celebrity. Whatever the parent is doing is inherited by the child.<br />
<br />
In programming, method overriding means that whatever the parent class is doing, it is inherited by the child class. Given the code below:<br />
<br />
<code><br />
class CodeGalaxy</code><br />
<code>{</code><br />
<code>public void planet()</code><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">System.out.print("Pluto is not considered a planet");</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">class MilyWay extends CodeGalaxy</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">public void planet()</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">System.out.print("How many planets do we have now?");</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">public class RunningCode</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">public static void main(String args[])</span><br />
<span class="Apple-style-span" style="font-family: monospace;">{</span><br />
<span class="Apple-style-span" style="font-family: monospace;">CodeGalaxy output1 = new CodeGalaxy();</span><br />
<span class="Apple-style-span" style="font-family: monospace;">CodeGalaxy output2 = new Milkyway();</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<span class="Apple-style-span" style="font-family: monospace;">output1.planet();</span><br />
<span class="Apple-style-span" style="font-family: monospace;">output2.planet()</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;">}</span><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
Class <i>MilkyWay extends CodeGalaxy</i> is better understood as MilkyWay overrides CodeGalaxy. The output will be:<br />
<div style="text-align: center;"><i><span class="Apple-style-span" style="font-size: large;"><br />
</span></i></div><div style="text-align: center;"><i><span class="Apple-style-span" style="font-size: large;">Pluto is not considered a planet.How many planets do we have now?</span></i></div><br />
For more on Overriding, refer to next post about the extend keyword.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-393897104359643762011-07-04T19:16:00.002+08:002011-07-04T19:16:00.716+08:00Method Overloading<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><b><br />
</b></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">Whenever a two or more methods have the same name but different behaviors or parameters, it is called <i>method overloading</i>.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">A good example of method overloading is a set (or a pair) of people with the same name. A very good example to understand this are social networking sites. Let's say that there are two people with the name <i>Aphrodite Keys</i> on Facebook. The first <i>Aphrodite Keys</i> is a famous celebrity, while the second is just a poser.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">Between the two Aphrodite Keys, it is obvious that both have the same name. It is also obvious that both have different personalities and behaviors. The original Aphrodite Keys posts updates regarding her work and insights of life honestly, while the poser Aphrodite Keys posts different things that may help gain her social network fame.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">Given the codes below....</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">class CodeGalaxy</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">{</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">public int sum;</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">public CodeGalaxy()</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">{</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">sum = 0;</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">}</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">public void Add(int num1, int num2)</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">{</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">sum = num1 + num2;</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;"><br />
</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">public void Add(int num1, int num2, int num3)</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">sum=int1+num2+num3;</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;"><br />
</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">public void Add(int num1)</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">{</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">sum = num1;</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">The code of the main class is the following:</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">public class UseGalaxy</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">{</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">public static void mai (String args[])</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">{</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">CodeGalaxy planet = new CodeGalaxy();</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">planet.Add(2,3);</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">planet.Add(1,2,3);</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">planet.Add(100);</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><span class="Apple-style-span" style="font-family: monospace;">}</span><span class="Apple-style-span" style="font-family: monospace;"><br />
</span><span class="Apple-style-span" style="font-family: monospace;">}</span></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">Using the first <i>planet.Add </i>with parameters 2 and 3, the values are passed on the first (<i>public void) Add</i> in your object. The values of the second <i>planet.Add</i> with parameters 1,2 and 3, are passed on the second <i>(public void) Add</i> in your object. The last <i>planet.Add</i> with 1 as its parameter is passed on the last method in your object.</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><br />
</div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">The main idea is: You cannot pass <i>planet.Add(2,3) </i> to the second method in your object with <i>public void Add(int1, int2, int3)</i> since planet.Add has only two values and the method requires three values. Therefore, in order to use planet.Add(2,3), the values are passed on the first method with public void Add(int1,int2)</div>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-8447440509057548902011-06-30T21:24:00.002+08:002011-06-30T21:24:00.438+08:00Parameters and Polymorphism<b>Parameters</b><br />
A parameter is a special variable that are used as a subroutine to connect to another piece of an inputted data in that subroutine. Some programming languages refer parameters as <i>arguments.</i> There are two kinds of parameters: <i>formal parameter </i>and <i>actual parameter.</i><br />
<i><br />
</i><br />
<b>Formal Parameter</b><br />
Formal parameters are actually any kinds of variables placed inside a parenthesis. In the example below, the formal parameters are <i>num1 </i>and <i>num2</i><br />
<code><br />
class CodeGalaxy<br />
{<br />
public int sum;<br />
<br />
public CodeGalaxy()<br />
{<br />
sum = 0;<br />
}<br />
<br />
public void Add(int num1, int num2)<br />
{<br />
sum = num1 + num2;<br />
}<br />
}<br />
<br />
</code><br />
<b>Actual Parameters</b><br />
An actual parameter is the <i>value</i> of the formal parameter. In the example below, the actual parameters are <i>2</i> and <i>3.</i> The values of the actual parameter are passed to the formal parameter. If you refer to the codes above (formal) and the codes below (actual), 2 is passed to the formal parameter <i>num1</i>, while 3 is passed to the formal parameter <i>num2</i>.<br />
<br />
<code><br />
public class UseGalaxy<br />
{<br />
public static void mai (String args[])<br />
{<br />
CodeGalaxy planet = new CodeGalaxy();<br />
planet.Add(2,3);<br />
}<br />
}<br />
</code><br />
<br />
<br />
<div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;"><b>Polymorphism</b></div><div style="margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px;">Polymorphism originated from the Greek word <i>poly</i> which means <i>many</i>, and <i>morph</i> which means <i>form</i>. Therefore, polymorphism means <i>many forms</i>. In programming, polymorphism is a variable, function, or (commonly) an object that has many forms. The main purpose of polymorphism in programming is for creating one name that can be used for a general class. Method Overriding and Method Overloading is a type of Polymorphism.</div><div><br />
For more polymorphism, see next post (Method Overloading and Method Overriding)</div><b><br />
</b>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-25241157743837986382011-06-23T10:34:00.001+08:002011-06-23T10:34:00.812+08:00Packages (Java)<b><u>What is a Package?</u></b><br />
<b><u><br />
</u></b><br />
Java allows us to group classes in a collection, known as the <i>Package.</i><br />
<i><br />
</i><br />
A <i>package</i> is a helpful tool in organizing our work as well as separating our work from the libraries of codes made by others.<br />
<br />
The standard Java library is known to have distributed over a number of packages, including the following:<br />
<code><br />
</code><br />
<ul><li><code>java.util</code></li>
<li><code>java.lang</code></li>
<code>
<li>java.net</li>
</code></ul><b><u>Reason for Using Packages</u></b><br />
<b><br />
</b><br />
The purpose of using packages is to guarantee the uniqueness of class names. Two junior programmers, for example, come up with a good idea of supplying a <i>price </i>class. As long as the two programmers place their class in different packages, there is nothing wrong with it.<br />
<br />
The sole purpose of package nesting is to manage their unique names. From the point of view of the complier, there is absolutely no relationship between nested packages. Similar to the packages <code>java.util</code> and <code>java.util.jar</code> both have nothing to do with each other since each has its own independent collection of classes.<br />
<b><u><br />
</u></b><br />
<b><u>Using Packages</u></b><br />
<b><u><br />
</u></b><br />
A class can use all classes from its own package, including all <i>public</i> classes from other packages. There are indeed two ways to access public class, and those are the following:<br />
<br />
<b>1. Add the full package name in front of <i>every </i>class name</b><br />
<code><br />
java.util.Date today = new java.util.Date();<br />
</code><br />
<br />
<b>2. The <i>import </i>keyword</b><br />
<code><br />
import java.io.*;</code><br />
<br />
<br />
<b><u>The IMPORT keyword</u></b><br />
<b><u><br />
</u></b><br />
The <i>import</i> statement gives you a shorthand to refer classes in the package. Once you use it, yo no longer have to give the classes their full names.<br />
<br />
The * symbol is only used to import a single package. It makes you import the whole package itself.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-74160755339635298142011-01-23T17:30:00.005+08:002011-01-23T17:49:09.616+08:00Order of Precedence for Java Operators<center style="text-align: left;">Similar to Mathematics' PEMDAS or MDAS, Java also has its own Order of Precedence which is to be followed when understanding, creating or reading Java programs. It is a way for Java to determine which operator should it evaluate first before the others.</center><center style="text-align: left;"><br />
</center><center style="text-align: left;">Below is the Order of Precedence displayed from the highest to the lowest precedence:</center><center><br />
<br />
<table border="1" bordercolor="#808080" cellpadding="3" cellspacing="0" height="100%"><tbody>
<tr><td align="center" valign="top"><b><span class="Apple-style-span" style="font-size: large;"><span class="Apple-style-span" style="font-family: inherit;">Priority </span></span></b></td><td align="center" valign="top"><b><span class="Apple-style-span" style="font-family: inherit; font-size: large;">Operator </span></b></td><td align="center" valign="top"><b><span class="Apple-style-span" style="font-family: inherit; font-size: large;">Use</span></b></td></tr>
<tr><td align="center" valign="top">1</td><td align="center" valign="top">[ ]</td><td align="center" valign="top">index of arrays</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">( )</td><td align="center" valign="top">calling methods</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">.</td><td align="center" valign="top">access members</td></tr>
<tr><td align="center" valign="top">2</td><td align="center" valign="top">++</td><td align="center" valign="top">increment</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">--</td><td align="center" valign="top">decrement</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">+, -</td><td align="center" valign="top">unary add, subtract</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">~</td><td align="center" valign="top">NOT (bitwise)</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">!</td><td align="center" valign="top">NOT (boolean / logical)</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">(type)</td><td align="center" valign="top">new type cast</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">(new)</td><td align="center" valign="top">new object</td></tr>
<tr><td align="center" valign="top">3</td><td align="center" valign="top">*, /, %</td><td align="center" valign="top">multiplication, division, modulo (remainder)</td></tr>
<tr><td align="center" valign="top">4</td><td align="center" valign="top">+, - </td><td align="center" valign="top">addition, subtraction </td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">+</td><td align="center" valign="top">concatination</td></tr>
<tr><td align="center" valign="top">5</td><td align="center" valign="top"><<</td><td align="center" valign="top">signed bit shift left</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">>></td><td align="center" valign="top">signed bit shift right</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">>>></td><td align="center" valign="top">unsigned bit shift right</td></tr>
<tr><td align="center" valign="top">6</td><td align="center" valign="top"><, <=</td><td align="center" valign="top">less than, less than or equal to</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">>, >=</td><td align="center" valign="top">greater than, greater than or equal to</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">instanceof</td><td align="center" valign="top">calling/testing references</td></tr>
<tr><td align="center" valign="top">7</td><td align="center" valign="top">= =</td><td align="center" valign="top">is equal to</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">! =</td><td align="center" valign="top">is not equal to</td></tr>
<tr><td align="center" valign="top">8</td><td align="center" valign="top">&</td><td align="center" valign="top">AND (bitwise and logical)</td></tr>
<tr><td align="center" valign="top">9</td><td align="center" valign="top">^</td><td align="center" valign="top">XOR (bitwise and logical)</td></tr>
<tr><td align="center" valign="top">10</td><td align="center" valign="top">|</td><td align="center" valign="top">OR (bitwise and logical)</td></tr>
<tr><td align="center" valign="top">11</td><td align="center" valign="top">&&</td><td align="center" valign="top">Boolean AND</td></tr>
<tr><td align="center" valign="top">12</td><td align="center" valign="top">||</td><td align="center" valign="top">Boolean OR</td></tr>
<tr><td align="center" valign="top">13</td><td align="center" valign="top">?, , , :</td><td align="center" valign="top">conditional statements</td></tr>
<tr><td align="center" valign="top">14</td><td align="center" valign="top">=</td><td align="center" valign="top">assignment</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">*=, /=, +=, -=</td><td align="center" valign="top">combinated assignment</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">%=</td><td align="center" valign="top">combinated assignment</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top"><<=, >>=</td><td align="center" valign="top">combinated assignment</td></tr>
<tr><td align="center" valign="top"><br />
</td><td align="center" valign="top">&=,^=, |=</td><td align="center" valign="top">combinated assignment</td></tr>
</tbody></table></center><br />
<br />
<b>Reminder: </b><br />
<ul><li> Expressions within the parenthesis are first to be evaluated<br />
</li>
<li> Nested Parenthesis are evaluated from the inner to the outer parenthesis.<br />
</li>
<li> Higher precedence are done first before the lower precedence.<br />
</li>
</ul>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-25161592405300092602011-01-11T17:58:00.000+08:002011-01-11T17:58:06.532+08:00Stacks and Queues in JavaThe <i>stack</i> and the <i>queue</i> is defined by two basic operations: insert a new item, and remove an item.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2V_kJyi4ZGX7_0sSA7Ad1ttDYdZKjZoJNGOEeCFbqfYqsRN_5VVTB5eFat5WTYgK0s0iFP7Zf2tWkC19BJgk5Sq8DJHjw6DOopjBoKDHRue5sgpdFHC-fvBXdzM2l5BO6VnvhZHE1vXpA/s1600/untitled.bmp" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="75" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2V_kJyi4ZGX7_0sSA7Ad1ttDYdZKjZoJNGOEeCFbqfYqsRN_5VVTB5eFat5WTYgK0s0iFP7Zf2tWkC19BJgk5Sq8DJHjw6DOopjBoKDHRue5sgpdFHC-fvBXdzM2l5BO6VnvhZHE1vXpA/s320/untitled.bmp" width="320" /></a></div><br />
<br />
Representing stacks and queues with arrays is a natural idea. The rule used for a queue is to always remove the item that has been in the collection the most amount of time. This policy is known as first-in-first-out or FIFO. The rule used for a stack is to always remove the item that has been in the collection the least amount of time. This policy is known as last-in first-out or LIFO. <br />
<br />
In stacking, we name the stack insert method push() and the stack remove operation pop(). When we queue, we name the insert method enqueue() and the remove dequeue().<br />
<br />
Here's an exercise we just did in school today though it's quite complicated, i just wanna share the codes. It's about push(inserting) and pop(deleting) for the stack; as well as enqueue(inserting) and dequeue(deleting). Download the codes below:<br />
<br />
<a href="https://docs.google.com/uc?id=0B7JXI2bYKBWmYTY5NGQ3MjUtYmY0NC00MzY5LTljMDEtZjJlY2UzMDU3MWNm&export=download&authkey=CMuLypoC&hl=en"><img src="http://www.amipaperless.com/images/DownloadFile.png" /></a><br />
<br />
<a href="https://docs.google.com/uc?id=0B7JXI2bYKBWmNzkyZWRlZjgtYTgxZS00ZGZhLTk3YzktMTUwMmQ4MjVkZmM1&export=download&authkey=CPSexOAK&hl=en"><img src="http://www.amipaperless.com/images/DownloadFile.png" /></a><br />
<br />
<a href="https://docs.google.com/uc?id=0B7JXI2bYKBWmOTZhOGU0OGMtODJlNi00MTU3LWIzZmItYTc3MzBkOGI5MTQ2&export=download&authkey=CKmAnZUM&hl=en"><img src="http://www.amipaperless.com/images/DownloadFile.png" /></a><br />
<br />
It's important to download all three files.Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-26884758313893249642011-01-10T17:57:00.000+08:002011-01-10T17:57:27.372+08:00VB6 ListboxI'm posting an exercise of Visual Basic Properties for the List Box tool. Check this out.<br />
<br />
Given this two listboxes where the first listbox lists the different states of the United States, and the second listbox with an empty list.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://www.vbexplorer.com/VBExplorer/vb_feature/june2000/Image62.gif" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="261" src="http://www.vbexplorer.com/VBExplorer/vb_feature/june2000/Image62.gif" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><div style="font-size: 0.5em;">Image by VBExplorer</div></td></tr>
</tbody></table><br />
<div>Let's rename the lists of the first listbox. Instead of a list of the different states, try to list down different dishes and put a little label below the listbox with the caption, <i>Menu</i>. Name the first listbox as <i>lstMenu</i>. Under the second listbox with an empty list, put another label below it with the caption of <i>Orders</i>. Name the second list box as <i>lstOrders</i>.</div><div><br />
</div><div>So what's the catch? Once you select a dish from <i>lstMenu </i>and press the >>>> button, that dish will be copied to <i>lstOrders</i>.</div><div><br />
</div><div><b><u>Solution:</u></b></div><div><br />
</div><div>Double click on the >>>> button and type the following:</div><blockquote><code><br />
Private Sub cmdLeft_Click()<br />
listOrders.RemoveItem listOrders.ListIndex<br />
End Sub<br />
</code></blockquote><div><br />
Next, double click on the second button (with the caption of <<<<) and type the code:</div><blockquote><code><br />
Private Sub cmdRight_Click()<br />
listOrders.AddItem (listMenu)<br />
End Sub</code></blockquote><br />
Once you get it right, you are now free to play with menu-order system by clicking on the <b>>>>></b> and <b><<<< </b>buttons. See how the texts appear and disappear in the empty listbox.Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-5751173410993417764.post-25753767019575143482011-01-10T03:00:00.004+08:002011-01-10T03:00:05.322+08:00What is the use of Compiling in Java?<div class="separator" style="clear: both; text-align: center;"></div><br />
Here's a diagram of Computer Languages.<br />
<br />
Machine language is all it starts since our computer can only read numbers 1 and 0. Then there goes Low-level languages, where a very good example is Assembly language and the C programming (language. Then there is High-level language, where you can find Visual Basic and Java.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWXgKCNKzM0Ub6wI6EkMz1ZyGt2w15CzYjrwbZ884EEYqvl1ZE80h1y3nQG3KB65s7dOFa5iinYTgT5gb-N41wSyc2D-3ZpnafhgvJcw5kYZoM2uTOcxH8oeH4SVJSaDMlstvd5-Rsq0f1/s1600/ethel.bmp" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWXgKCNKzM0Ub6wI6EkMz1ZyGt2w15CzYjrwbZ884EEYqvl1ZE80h1y3nQG3KB65s7dOFa5iinYTgT5gb-N41wSyc2D-3ZpnafhgvJcw5kYZoM2uTOcxH8oeH4SVJSaDMlstvd5-Rsq0f1/s1600/ethel.bmp" /></a></div><div class="separator" style="clear: both; text-align: center;"><br />
</div>So what's the use of Compiling in Java? Why can't you not run the program right away without compiling?<br />
<br />
Because Java is one of the High-level languages, it translates it to a low level language and finally, machine language since as said earlier that our computer can only read binary digits.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc7RuH3n4a-bpqhFXqSBq9asHbuz1tv5jXSXoRTwhK2ZPdabJZulGmVHrbb6HMtnw4p9hJvOwsoWWuG0ezlPrstvkg9erMNIOhMfblr51kDtEDoeCEdAk9bGTNU_Ala41eD2zBUZOUtDo5/s1600/ethel2.bmp" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc7RuH3n4a-bpqhFXqSBq9asHbuz1tv5jXSXoRTwhK2ZPdabJZulGmVHrbb6HMtnw4p9hJvOwsoWWuG0ezlPrstvkg9erMNIOhMfblr51kDtEDoeCEdAk9bGTNU_Ala41eD2zBUZOUtDo5/s1600/ethel2.bmp" /></a></div><br />
<br />
So that means that the codes we type and the variables we create are translated to a language which the computer can only understand.<br />
<br />
We cannot understand Machine Language immediately. It takes time to understand each line of Machine Language since each 1 and 0 has its own designated meaning depending on how we code it.Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-5751173410993417764.post-75347947560047567202011-01-09T16:44:00.000+08:002011-01-09T16:44:00.629+08:00For Next Loops in Visual Basic 6.0A <i>For Next Loop</i> lets you execute a specific group of program statements a set of number times in an event procedure. This is useful if you are performing several related calculations, working with elements on screen ot processing several pieces for user inputs.<br />
<br />
A <i>For Next Loop</i> is just a shortcut of writing a long list of statements. Because each group of statements in such a list would do essentially the same thing, VB lets you define just one group of statements and request that it would be executed as many times as you want.<br />
<br />
In a <i>For Next Loop</i>, <b>start</b> and <b>end</b> determine how long the loop runs<br />
<br />
Check the syntax below:<br />
<blockquote><code><br />
<br />
for <i>your_variable = start To end</i><br />
<i> code block</i><br />
<i> or</i><br />
<i> statements to be repeated</i><br />
<i>Next your_variable</i><br />
<i><br />
</i></code></blockquote>Example:<br />
The following For Next Loop sounds four beeps in rapid succession from the computer's speakers:<br />
<blockquote><code><br />
For x = 1 To 4<br />
Beep<br />
Next x</code></blockquote><br />
so the output of that would be:<br />
<br />
Beep<br />
Beep<br />
Beep<br />
Beep<br />
<br />
<span class="Apple-style-span" style="font-size: xx-small;"><br />
</span><br />
<span class="Apple-style-span" style="font-size: xx-small;">Based from the book Step by Step Microsoft Visual Basic</span>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-12335218262576506482011-01-09T14:36:00.000+08:002011-01-09T14:36:00.953+08:00Until Keyword in Do [While] LoopsVisual Basic lets you try the <i>Until</i> keyword in Do [While] Loops <i>until</i> a certain condition is true. The <i>Until</i> keyword can be used at the top or the bottom of a Do [While] Loop to test a condition (similar to the While Loop).<br />
<br />
Check this example below<br />
<blockquote><code> Do<br />
InputName = InputBox("Enter item or type Finish to quit.")<br />
If InputName <> "Finish" Then Print InputName<br />
Loop Until InputName = "Finish" <br />
</code></blockquote><span class="Apple-style-span" style="font-size: xx-small;"><br />
</span><br />
<span class="Apple-style-span" style="font-size: xx-small;">Based from the book Step by Step Microsoft Visual Basic</span>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-5751173410993417764.post-30632717220344522952011-01-09T12:36:00.001+08:002011-01-09T12:38:01.882+08:00Do Loops on Visual BasicA <b>Do Loop </b>executes a line, or lines of code until a specific condition is met. It is sometimes referred as <i>Do While Loops</i> to some.<br />
<br />
For example, you want to let the user enter names in a database until the user types the word <i>Finish</i> in an input box, or maybe until the user clicks the <i>Done</i> button. In that case, you can use a Do [While] Loop cycle until the next string <i>Finish</i> is entered or until the user clicks the <i>Done </i>button.<br />
<br />
A Do [While] Loop has several formats, depending on where and how the loop condition is evaluated. The most common syntax used is:<br />
<blockquote><code><br />
Do While (condition)<br />
code block<br />
or<br />
block of statements<br />
to be executed<br />
Loop<br />
<code></code></code></blockquote><code><code><br />
</code></code><br />
<span class="Apple-style-span" style="font-family: monospace;"><br />
</span><br />
<code><code>More examples will be posted soon. </code></code><br />
<code><code><br />
</code></code><br />
<code><code><span class="Apple-style-span" style="font-size: xx-small;"><br />
</span></code></code><br />
<span class="Apple-style-span" style="font-family: monospace; font-size: xx-small;">Based on the book, Step by Step Microsoft Visual Basic 6.0</span>Unknownnoreply@blogger.com0