7:32 PM Красива форма за HTML | |
Първо сложете този код между таговете <head> и </head>HTML код:<link type="text/css" rel="stylesheet" href="http://www.dreamtemplate.com
dreamcodes/form_beautify/css/jqtransform.css" /> <script type="text/javascript" src="http://www.dreamtemplate.com/dreamcode s/jquery.min.js"></script> <script type="text/javascript" src="http://www.dreamtemplate.com/dreamcode s/form_beautify/js/jquery.jqtra nsform.js"></script> <script language="javascript"> $(function(){ $('form').jqTransform({imgPath:'form_beautify/img/'}); }); </script>
Форма №1 :
HTML код:<form action="url-to-post-to.php" method="POST">
<table border="0" cellspacing="0" cellpadding="6" bgcolor="#ffffff" style="padding:25px; border:1px dotted #ccc; "> <tr> <td><label>Input Text:</label></td> <td><input name="input1" type="text" size="25" /></td> </tr> <tr> <td><label>Input Password:</label></td> <td><input type="password" size="25" /></td> </tr> <tr> <td><label>Check Box: </label></td> <td><input type="checkbox" name="checkbox1" /></td> </tr> <tr> <td><label>Radio Button:</label></td> <td><input type="radio" name="radio1" value="Yes" checked="checked" /> <label>Yes</label> <input type="radio" name="radio2" value="No" /> <label>No</label></td> </tr> <tr> <td><label>Textarea :</label></td> <td><textarea cols="33" rows="6" name="textarea1"></textarea></td> </tr> <tr> <td><label>Select Menu :</label></td> <td><select name="selectmenu1"> <option value="salesdept">Sales Department </option> <option value="supportdept">Support Department </option> <option value="billingdept">Billing Department </option> </select></td> </tr> <tr> <td><label>Submit Button:</label></td> <td><input type="submit" value="Submit Now" /></td> </tr> <tr> <td><label>Reset Button:</label></td> <td><input type="reset" value="Reset" /></td> </tr> <tr> <td><label>Input Button:</label></td> <td><input type="button" value="Input Button" /></td> </tr> </table> </form> Форма №2 :
HTML код:<form action="url-to-post-to.php.php" method="POST">
<div class="rowElem"> <label>Input Text:</label> <input type="text" name="input1" size="25" /> </div> <div class="rowElem"> <label>Input Password:</label> <input type="password" size="25" /> </div> <div class="rowElem"> <label>Checkbox: </label> <input type="checkbox" name="checkbox1" id=""> </div> <div class="rowElem"> <label>Radio Button:</label> <input type="radio" id="" name="question" value="Yes" checked > <label>Yes</label> <input type="radio" id="" name="question" value="No" > <label>No</label> </div> <div class="rowElem"> <label>Textarea :</label> <textarea cols="33" rows="6" name="textarea1"></textarea> </div> <div class="rowElem"> <label>Select Menu :</label> <select name="selectmenu1"> <option value="salesdept">Sales Department </option> <option value="supportdept">Support Department </option> <option value="billingdept">Billing Department </option> </select> </div> <div class="rowElem"> <label>Submit Button:</label> <input type="submit" value="Submit Button" /> </div> <div class="rowElem"> <label>Reset Button:</label> <input type="reset" value="Reset Button" /> </div> <div class="rowElem"> <label>Input Button:</label> <input type="button" value="Input Button" /> </div> </form> Ако имате въпроси използвайте формата за коментари след урока. | |
|
| |
Ако урокът ви е харесал можете да го споделите с вашите приятели във фейсбук :
| Всички коментари: 0 | |
