WEB初学者最重要的三门外语好吧:html、css、javascript.
这些都自然在W3School上学。
这里就从html表单方面记起吧,前面也没什么好说的,html就是一种标记语言,站上也讲得很简单,这里就先把它上面的常用标签贴出来:
HTML 4.01 快速参考
来自 W3School 的 HTML 快速参考。可以打印它,以备日常使用。
HTML Basic Document
<html> <head> <title>Document name goes here</title> </head> <body> Visible text goes here </body> </html>
Text Elements
<p>This is a paragraph</p> <br> (line break) <hr> (horizontal rule) <pre>This text is preformatted</pre>
Logical Styles
<em>This text is emphasized</em> <strong>This text is strong</strong> <code>This is some computer code</code>
Physical Styles
<b>This text is bold</b> <i>This text is italic</i>
Links, Anchors, and Image Elements
<a href="http://www.example.com/">This is a Link</a> <a href="http://www.example.com/"><img src="URL" alt="Alternate Text"></a> <a href="mailto:webmaster@example.com">Send e-mail</a>A named anchor: <a name="tips">Useful Tips Section</a> <a href="#tips">Jump to the Useful Tips Section</a>
Unordered list
<ul> <li>First item</li> <li>Next item</li> </ul>
Ordered list
<ol> <li>First item</li> <li>Next item</li> </ol>
Definition list
<dl> <dt>First term</dt> <dd>Definition</dd> <dt>Next term</dt> <dd>Definition</dd> </dl>
Tables
<table border="1"> <tr> <th>someheader</th> <th>someheader</th> </tr> <tr> <td>sometext</td> <td>sometext</td> </tr> </table>
Frames
<frameset cols="25%,75%"> <frame src="page1.htm"> <frame src="page2.htm"> </frameset>
Forms
<form action="http://www.example.com/test.asp" method="post/get"> <input type="text" name="lastname" value="Nixon" size="30" maxlength="50"> <input type="password"> <input type="checkbox" checked="checked"> <input type="radio" checked="checked"> <input type="submit"> <input type="reset"> <input type="hidden"> <select> <option>Apples <option selected>Bananas <option>Cherries </select> <textarea name="Comment" rows="60" cols="20"></textarea> </form>
Entities
< is the same as < > is the same as > © is the same as ©
Other Elements
<!-- This is a comment --> <blockquote> Text quoted from some source. </blockquote> <address> Address 1<br> Address 2<br> City<br> </address>
Source : http://www.w3school.com.cn/html/html_quick.asp
HTML表单:
看了相关知识后,我用代码实现了一些简单的功能如图所示,足以解释表单知识:
代码如下:仅供本人菜鸡观赏而已
<!DOCTYPE html>
<html>
<body>
<form method="GET">
<fieldset>
<legend>Personal information</legend>
First name:<br>
<input type="text" name="firstname" placeholder="First name" autofocus>
<br>
Last name:<br>
<input type="text" name="lastname" value="Guy" placeholder="Last name" readonly>
<br>
<input type="email" name="email" autocomplete="on">
<br>
<input type="radio" name="sex" value="male">Male
<br>
<input type="radio" name="sex" value="female">Female
<br>
<br>
<input type="checkbox" name="vehicle" value="ifhaveabike">I have a bike
<br>
<input type="checkbox" name="vehicle" value="ifhaveacar">I have a car
<br>
<select name="cars">
<option value="audi">Audi</option>
<option value="saab">Saab</option>
<option value="bmw">BMW</option>
</select>
<br>
Birthday:<br>
<input type="date" name="bday" min="1980-01-01" max="2017-01-22">
<br>
Quantity (between 1 and 5):
<input type="number" name="quantity" min="1" max="5">
<br>
<textarea name="message" rows="10" cols="30">
The cat was playing in the garden
</textarea>
<br>
<button type="button" onclick="alert"("aha!you've clicked!")>Click ME!</button>
<br>
选择图片<input type="file" name="img" multiple>
<br>
</fieldset>
<fieldset>
<legend>Assistant</legend>
User name:<br>
<input type="text" name="username">
User password:<br>
<!--password 会做掩码处理-->
<input type="password" name="psd">
</fieldset>
<br><br>
<input type="submit" value="Submit Now">
</form>
</body>
</html>