HTML Finishing (2)

Use mailto to link email addresses in Web pages

<a>Tags also have a role to link email addresses, using mailto can make it easy for visitors to send e-mail to the website manager. We can also take advantage of mailto doing a lot of other things. Here's a look at the detailed illustrations:

Note : If there are multiple parameters at the same time behind the mailto, the first argument must begin with " ? " and each subsequent parameter is delimited with "" & .

The following is a complete example:

</ P > How do you feel about this film, send me an email <  href= "Mailto:[email protected]"? subject= view of the Great Gatsby &body= Hello , some ideas about this comment >

tab to insert a picture.

Grammar:

Example:

Explain:

1 , SRC: identifies the location of the image;

2 , alt: specifies descriptive text for the image, and when the image is not visible (when the download is unsuccessful), you can see the text specified by the attribute;

3 , Title: provides a description of the image when the image is visible (the text displayed when the mouse slides over the picture);

4 . The image can be an image file in gif,png,jpeg format.

Use form labels to interact with users

How does a website interact with users? The answer is to use an HTML form (form). The form can transfer the data entered by the browser to the server side, so that the server-side program can process the data that the table only son over.

Grammar:

<form   method= "transfer mode"   action= "Server file" >

Explain:

1.<form>:<form> tag is in pairs, to <form> start, to </form> end.

2.Action : where the data entered by the browser is transmitted, such as a PHP page (save.php).

3.method : The way data is transmitted (Get/post).

<form    method= "POST"   action= "save.php">        <label for= "username" > User name: </label >        <input type= "text" name= "username"/>        <label for= "pass" > Password:</label>        < Input type= "password" name= "pass"/></form>

Attention:

1. All form controls (text boxes, text fields, buttons, radio boxes, checkboxes, and so on) must be placed between the <form></form> tags (otherwise the user input information can not be submitted to the server Oh!). ）。

2, Method:post/get the difference this part of the content belongs to the back-end programmer to consider the problem. Interested partners can view the wiki in this section, which is described in detail.

Text input box, password entry box

A text input box is used when the user wants to type something like letters, numbers, and so on in the form. The text box can also be converted into a password entry box .

Syntax :

<form>   <input type= "Text/password" name= "name" value= "text"/></form>

1、type：

   当type="text"时，输入框为文本Input box;

   当type="password"时,输入框为密码输入框。

2、name：为文本框命名，以备后台程序ASP 、PHP使用。

3、value：为文本输入框设置默认值。(一般起到提示作用)

举例：

<form>  Name:  <input type= "text" name= "MyName" >  <br/>  Password:  <input type= " Password "name=" pass "></form>

Results displayed in the browser:

<formMethod= "POST"Action= "save.php">Account:<inputtype= "text"name= "MyName"/><BR/>Password:<inputtype= "Password"name= "Pass"/><BR/>    </form> 

Text fields, multi-line text input support

Text input fields are required when users need to enter large pieces of text in the form.

Syntax :

<textarea  rows="行数"cols="列数">文本</textarea>

1、<textarea>标签是成对出现的，以<textarea>开始，以</textarea>结束。

2、cols ：多行输入域的列数。

3、rows ：多行输入域的行数。

4、在<textarea></textarea>标签之间可以输入默认值。

举例：

<form  method= "POST" action= "save.php" >         <label> 联系我们</label>   <textarea cols="50" rows="10" > 在这里输入内容... </textarea> </form>

Note: The <label> tags in the code are explained in this chapter 5-9.

Display the results in the browser:

<formAction= "save.php"Method= "POST" >    <label>Personal Profile:</label>    <textareacols= " the"rows= "Ten">Enter the content here ...</textarea>    <inputtype= "Submit"value= "OK"name= "Submit" />    <inputtype= "Reset"value= "Reset"name= "Reset" /></form> 

Use the Radio box, check box, to let the user select

在使用表单设计调查表时，为了减少用户的操作，使用选择框是一个好主意，html中有两种选择框，即单选框和复选框，两者的区别是单选框中的选项用户只能选择一项，而复选框中用户可以任意选择多项，甚至全选。请看下面的例子:

语法：

<input   type= "Radio/checkbox"   value= "value"    name= "name"   checked= "checked"/>

1.Type:

When type= "Radio" , the control is a radio box

When type= "checkbox" , the control is a check box

2, Value: submit data to the server values (background program PHP use)

3,name: for the control name, in case the background program ASP, PHP use

4,checked: When set checked= "checked", this option is selected by default

As in the following code:

Note: The <label> tags in the code are explained in this chapter 5-9.

Results displayed in the browser:

The same group of radio buttons, name value must be consistent, such as the above example is the same name "Radiolove", so that the same group of radio buttons can play the role of radio.

<formAction= "save.php"Method= "POST" >    <label>Gender:</label>    <label>Man</label>    <inputtype= "Radio"value= "1"name= "Gender" />    <label>Woman</label>    <inputtype= "Radio"value= "2"name= "Gender" /></form>

Save space with a drop-down list box

Drop-down lists are often used in Web pages, which can effectively save web space. It can be both single-choice and multi-select. The following code:

Explain:

1. Value:

2,selected= "selected":

Set the selected= "selected" property, the option is selected by default.

Results displayed in the browser:

HTML Finishing (2)