| <?xml version="1.0"?> |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en" xml:lang="en"> |
| <head> |
| <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> |
| <meta http-equiv="content-style-type" content="text/css" /> |
| <meta http-equiv="content-language" content="en" /> |
| <meta name="keywords" content="centos web forms visual style guide" /> |
| <meta name="description" content="CentOS forms visual style guide is a tool to help you customize forms inside CentOS websites." /> |
| <meta name="copyright" content="2009-2012 The CentOS Project" /> |
| <title>Forms - Home</title> |
| <link href="stylesheet.css" rel="stylesheet" type="text/css" media="screen, projection" /> |
| </head> |
| <body> |
| <a name="top" id="top"></a> |
| <div id="wrap"> |
| <div id="page-header"> |
| |
| |
| |
| |
| |
| <div id="logo"> |
| <a title="Community Enterprise Operating System" href="http://www.centos.org/"> |
| <img src="./Images/logo-centos.png" alt="CentOS" /> |
| </a> |
| </div> |
| |
| |
| |
| <div class="ads-google"> |
| <a title="Google Advertisement" href=""> |
| <img src="./Images/ads-sample-468x60.png" alt="Google Advertisement" /> |
| </a> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| </div> |
| |
| |
| |
| |
| |
| |
| <div class="page-line"> |
| <hr style="display:none;" /> |
| </div> |
| <div class="tabs"> |
| <span class="current"> |
| <a accesskey="1" title="CentOS Home Page (Alt+Shift+1)" href="http://www.centos.org/"> |
| <span>Home</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="2" title="CentOS Wiki (Alt+Shift+2)" href="http://wiki.centos.org/"> |
| <span>Wiki</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="3" title="CentOS Mailing Lists (Alt+Shift+3)" href="http://lists.centos.org/"> |
| <span>Lists</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="4" title="CentOS Forums (Alt+Shift+4)" href="http://forums.centos.org"> |
| <span>Forums</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="5" title="CentOS Planet (Alt+Shift+5)" href="http://planet.centos.org"> |
| <span>Planet</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="6" title="CentOS Bugs (Alt+Shift+6)" href="http://bugs.centos.org"> |
| <span>Bugs</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="7" title="CentOS SIGs (Alt+Shift+7)" href="http://sigs.centos.org/"> |
| <span>SIGs</span> |
| </a> |
| </span> |
| <span> |
| <a accesskey="8" title="CentOS Downloads (Alt+Shift+8)" href="http://mirrors.centos.org"> |
| <span>Downloads</span> |
| </a> |
| </span> |
| </div> |
| |
| |
| |
| <div id="last-releases"> |
| <div class="left"> |
| <span class="title"><a href="">Last Releases</a>:</span> |
| <span class="release"> |
| <a href="">6.0</a> |
| </span> |
| <span class="release"> |
| <a href="">5.8</a> |
| </span> |
| <span class="release"> |
| <a href="">4.12</a> |
| </span> |
| <span class="release last"> |
| <a href="">3.18</a> |
| </span> |
| </div> |
| <div class="right"> |
| <span class="rss"> |
| <a href="" title="RSS"> |
| <span>RSS</span> |
| </a> |
| </span> |
| </div> |
| </div> |
| |
| |
| |
| |
| |
| <div id="appslinks"> |
| |
| |
| |
| |
| |
| <div class="userlinks"> |
| <div class="lastvisit"> |
| <span class="title"> |
| <a href="">Your last visit was at</a> |
| </span> |
| <span class="datetime">Thu Aug 25 14:13:05 CDT 2011</span> |
| </div> |
| <div class="session"> |
| <span> |
| <a href="">Lost your password?</a> |
| </span> |
| <span> |
| <a href="">Register</a> |
| </span> |
| <span class="last"> |
| <a href="">Login</a> |
| </span> |
| </div> |
| <div class="trail"> |
| <span> |
| <a href="">Pagination</a> |
| </span> |
| <span> |
| <a href="">Lists</a> |
| </span> |
| <span> |
| <a href="">Headings</a> |
| </span> |
| <span> |
| <a href="">Links</a> |
| </span> |
| <span> |
| <a href="">Texts</a> |
| </span> |
| <span class="last"> |
| <a href="">Home</a> |
| </span> |
| </div> |
| </div> |
| |
| |
| |
| |
| |
| <div class="tabs"> |
| <span> |
| <a title="Welcome to the web special interest group" href="index.html"> |
| <span>Welcome</span> |
| </a> |
| </span> |
| <span> |
| <a title="CentOS headings visual style guide." href="headings.html"> |
| <span>Headings</span> |
| </a> |
| </span> |
| <span> |
| <a title="CentOS texts visual style guide." href="texts.html"> |
| <span>Texts</span> |
| </a> |
| </span> |
| <span> |
| <a title="CentOS lists visual style guide." href="lists.html"> |
| <span>Lists</span> |
| </a> |
| </span> |
| <span> |
| <a title="CentOS links visual style guide." href="links.html"> |
| <span>Links</span> |
| </a> |
| </span> |
| <span> |
| <a title="CentOS tables visual style guide." href="tables.html"> |
| <span>Tables</span> |
| </a> |
| </span> |
| <span class="current"> |
| <a title="CentOS forms visual style guide." href="forms.html"> |
| <span>Forms</span> |
| </a> |
| </span> |
| <span> |
| <a title="CentOS pagination visual style guide." href="pagination.html"> |
| <span>Pagination</span> |
| </a> |
| </span> |
| </div> |
| </div> |
| <div class="page-line white"> |
| <hr style="display:none;" /> |
| </div> |
| </div> |
| |
| |
| |
| <div id="page-body"> |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| <div id="content"> |
| |
| |
| |
| <h1 class="title"> |
| <a name="head-0d403f9c0b0a9570f228cc2c044a6229" id="head-0d403f9c0b0a9570f228cc2c044a6229">Forms</a> |
| </h1> |
| <p>CentOS Forms Visual Style Guide.</p> |
| <div class="toc"> |
| <p>Table of contents</p> |
| <dl> |
| <dt> |
| <a href="#head-0d403f9c0b0a9570f228cc2c044a6229">Forms</a> |
| <dl> |
| <dt> |
| <a href="#head-d57fc1c185c264b10ccaafb659dbee08">Elements</a> |
| </dt> |
| <dt> |
| <a href="#head-6b5a22b6a29fce6bcec2e45d1350fa30">Recommendations</a> |
| </dt> |
| </dl> |
| </dt> |
| </dl> |
| </div> |
| <h2 class="title"> |
| <a name="head-d57fc1c185c264b10ccaafb659dbee08" id="head-d57fc1c185c264b10ccaafb659dbee08">Elements</a> |
| </h2> |
| <form method="post" action="" title="Form Styles"> |
| <fieldset> |
| <legend>Fieldset:</legend> |
| <div class="row1"> |
| <span class="descrip">input[type="text"]</span> |
| <div class="field"> |
| <input type="text" name="fname" value="" size="30" /> |
| </div> |
| </div> |
| <div class="row2"> |
| <span class="descrip">input[type="password"]</span> |
| <div class="field"> |
| <input type="password" name="email" value="" size="30" /> |
| </div> |
| </div> |
| <div class="row1"> |
| <span class="descrip">textarea</span> |
| <div class="field"> |
| <textarea name="pdescrip" cols="40" rows="10"></textarea> |
| </div> |
| </div> |
| <div class="row2"> |
| <span class="descrip">select</span> |
| <div class="field"> |
| <select name="ulang" title="One Level Selection"> |
| <option value="" selected="selected"></option> |
| <option value="en">English</option> |
| <option value="es">Spanish</option> |
| <option value="fr">French</option> |
| <option value="it">Italian</option> |
| </select> |
| <select name="mlevel" title="Multi Level Selection"> |
| <option value="" selected="selected"></option> |
| <optgroup label="CentOS-3"> |
| <option value="c3-docs">Documentation</option> |
| <option value="c3-wiki">Wiki</option> |
| <option value="c3-download">Download</option> |
| <option value="c3-lists">Mailing Lists</option> |
| <option value="c3-forums">Forums</option> |
| <option value="c3-bugs">Bugs</option> |
| </optgroup> |
| <optgroup label="CentOS-4"> |
| <option value="c4-docs">Documentation</option> |
| <option value="c4-wiki">Wiki</option> |
| <option value="c4-download">Download</option> |
| <option value="c4-lists">Mailing Lists</option> |
| <option value="c4-forums">Forums</option> |
| <option value="c4-bugs">Bugs</option> |
| </optgroup> |
| <optgroup label="CentOS-5"> |
| <option value="c5-wiki">Wiki</option> |
| <option value="c5-docs">Documentation</option> |
| <option value="c5-download">Download</option> |
| <option value="c5-lists">Mailing Lists</option> |
| <option value="c5-forums">Forums</option> |
| <option value="c5-bugs">Bugs</option> |
| </optgroup> |
| </select> |
| <select multiple="multiple" title="Multiple Selection (One Level)" size="5"> |
| <option value="c5-wiki">Wiki</option> |
| <option value="c5-docs">Documentation</option> |
| <option value="c5-download">Download</option> |
| <option value="c5-lists">Mailing Lists</option> |
| <option value="c5-forums">Forums</option> |
| <option value="c5-bugs">Bugs</option> |
| </select> |
| <select multiple="multiple" title="Multiple Selection (Two Levels)" size="5"> |
| <optgroup label="CentOS-3"> |
| <option value="c3-docs">Documentation</option> |
| <option value="c3-wiki">Wiki</option> |
| <option value="c3-download">Download</option> |
| <option value="c3-lists">Mailing Lists</option> |
| <option value="c3-forums">Forums</option> |
| <option value="c3-bugs">Bugs</option> |
| </optgroup> |
| <optgroup label="CentOS-4"> |
| <option value="c4-docs">Documentation</option> |
| <option value="c4-wiki">Wiki</option> |
| <option value="c4-download">Download</option> |
| <option value="c4-lists">Mailing Lists</option> |
| <option value="c4-forums">Forums</option> |
| <option value="c4-bugs">Bugs</option> |
| </optgroup> |
| <optgroup label="CentOS-5"> |
| <option value="c5-wiki">Wiki</option> |
| <option value="c5-docs">Documentation</option> |
| <option value="c5-download">Download</option> |
| <option value="c5-lists">Mailing Lists</option> |
| <option value="c5-forums">Forums</option> |
| <option value="c5-bugs">Bugs</option> |
| </optgroup> |
| </select> |
| </div> |
| </div> |
| <div class="row1"> |
| <span class="descrip">checkbox</span> |
| <div class="field"> |
| <div class="column"> |
| <label title="Check 1"><input name="check[]" type="checkbox" value="1" />Check 1 column 1</label> |
| <br /> |
| <label title="Check 2"><input name="check[]" type="checkbox" value="2" />Check 2</label> |
| <br /> |
| <label title="Check 3"><input name="check[]" type="checkbox" value="3" />Check 3</label> |
| <br /> |
| <label title="Check 4"><input name="check[]" type="checkbox" value="4" />Check 4</label> |
| <br /> |
| </div> |
| <div class="column"> |
| <label title="Check 5"><input name="check[]" type="checkbox" value="5" />Check 5</label> |
| <br /> |
| <label title="Check 6"><input name="check[]" type="checkbox" value="6" />Check 6</label> |
| <br /> |
| <label title="Check 7"><input name="check[]" type="checkbox" value="7" />Check 7 column 2</label> |
| <br /> |
| <label title="Check 8"><input name="check[]" type="checkbox" value="8" />Check 8</label> |
| <br /> |
| </div> |
| <div class="colum"> |
| <label title="Check 9"><input name="check[]" type="checkbox" value="9" />Check 9</label> |
| <br /> |
| <label title="Check 10"><input name="check[]" type="checkbox" value="10" />Check 10</label> |
| <br /> |
| <label title="Check 11"><input name="check[]" type="checkbox" value="11" />Check 11</label> |
| <br /> |
| <label title="Check 12"><input name="check[]" type="checkbox" value="12" />Check 12</label> |
| <br /> |
| </div> |
| </div> |
| </div> |
| <div class="row2"> |
| <span class="descrip">radio</span> |
| <div class="field"> |
| <div class="column"> |
| <label title="Radio 1"><input name="radio" type="radio" value="1" />Radio 1 column 1</label> |
| <br /> |
| <label title="Radio 2"><input name="radio" type="radio" value="2" />Radio 2</label> |
| <br /> |
| <label title="Radio 3"><input name="radio" type="radio" value="3" />Radio 3</label> |
| <br /> |
| <label title="Radio 4"><input name="radio" type="radio" value="4" />Radio 4</label> |
| </div> |
| <div class="column"> |
| <label title="Radio 5"><input name="radio" type="radio" value="5" />Radio 5</label> |
| <br /> |
| <label title="Radio 6"><input name="radio" type="radio" value="6" />Radio 6</label> |
| <br /> |
| <label title="Radio 7"><input name="radio" type="radio" value="7" />Radio 7</label> |
| <br /> |
| <label title="Radio 8"><input name="radio" type="radio" value="8" />Radio 8</label> |
| </div> |
| </div> |
| </div> |
| <div class="page-line"> |
| <hr style="display:none;" /> |
| </div> |
| <div class="row3"> |
| <span class="submit"> |
| <input type="submit" name="upref" value="Submit" /> |
| </span> |
| <div class="descrip">Brief fieldset description here ... Brief |
| fieldset description here ... Brief fieldset description here |
| ... |
| </div> |
| </div> |
| </fieldset> |
| </form> |
| <h2 class="title"> |
| <a name="head-6b5a22b6a29fce6bcec2e45d1350fa30" id="head-6b5a22b6a29fce6bcec2e45d1350fa30">Recommendations</a> |
| </h2> |
| <ul> |
| <li>...</li> |
| </ul> |
| |
| |
| |
| <div class="page-line"> |
| <hr style="display:none;" /> |
| </div> |
| </div> |
| </div> |
| |
| |
| |
| <div id="page-footer"> |
| <div class="credits"> |
| <div class="top"> |
| <a title="Top" href="#top"> |
| <img src="./Images/top.png" alt="Top" /> |
| </a> |
| </div> |
| <div class="copyright">© 2009-2012 The CentOS Project. All rights reserved.</div> |
| <div class="license">This website is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-Share Alike 3.0 Unported License</a>.</div> |
| </div> |
| </div> |
| </div> |
| </body> |
| </html> |