HTML (iv)

HTML Table Table Common tags

1. Table Label: Declare a table

2. TR Label: Define a row in the table

3. TD and TH Tags: define a cell in a row, TD represents a normal cell, th represents a table header cell

Table Common Properties:

1. Border define the border of the table

2. cellpadding defines the distance between the contents of the cell and the border

3. cellspacing defines the distance between cells and cells

4, align set the horizontal alignment of the contents of the cell, setting the value is: left | Center | Right

5. valign sets the vertical alignment top of the contents of the cell | Middle | Bottom

6. Colspan Set Cell horizontal merge

7. RowSpan Set Cell vertical Merge

Traditional layouts:

The traditional layout method is to use table to do the overall layout of the page, the layout of the skills are summarized as follows:

1, define the table width height, border, cellpadding, cellspacing all set to 0

2. Nested table inside cell

3. Elements in cells and nested tables set alignment with align and valign

4. Set the style of elements in a cell by attributes or CSS styles

Traditional layouts are currently used:

1. Quickly create an HTML page for presentation

2, commercial promotion EDM production (advertising mail)

Table layout Instance (biographical page layout instance):

Table Common style properties

Border-collapse:collapse set border Merge to make a table with a pixel-wide edge

HTML form

Forms are used to collect different types of user input, forms are composed of different types of labels, to implement a specific function of the form area (such as: registration), the first should use the <form> tag to define the form area as a whole, in this label and then use a different form control to implement different types of information input, Specific implementations and annotations can be referenced by the following pseudo-code:

<!--The form defines a form area, the Action property defines the address of the form data submission, and the method property defines how the submission is committed.  -<formAction= "http://www ..."Method= "Get"><!--The label label defines the text callout for the form control, and the input type defines a single-line text input box for text -<P><label>Name:</label><inputtype= "text"name= "username" /></P><!--The input type defines a password input box for password -<P><label>Password:</label><inputtype= "Password"name= "Password" /></P><!--The input type defines a radio box for radio -<P><label>Gender:</label><inputtype= "Radio"name= "Gender"value= "0" />male<inputtype= "Radio"name= "Gender"value= "1" />female</P><!--the input type has a checkbox defined for checkboxes -<P><label>Hobby:</label><inputtype= "checkbox"name= "like"value= "Sing" />singing<inputtype= "checkbox"name= "like"value= "Run" />Running<inputtype= "checkbox"name= "like"value= "Swiming" />Swimming</P><!--input type is a file definition for resources such as uploading photos or files -<P><label>Photo:</label><inputtype= "File"name= "Person_pic"></P><!--textarea defining multiple lines of text input -<P><label>Personal Description:</label><textareaname= "about"></textarea></P><!--Select definition drop-down list selection -<P><label>Origin:</label><Selectname= "Site">    <optionvalue= "0">Beijing</option>    <optionvalue= "1">Shanghai</option>    <optionvalue= "2">Guangzhou</option>    <optionvalue= "3">Shenzhen</option></Select></P><!--The input type is a submit button that can also be submitted using the picture control instead of the submit button, which generally results in two submissions and is not recommended. Example: <input type= "image" src= "Xxx.gif" > -<P><inputtype= "Submit"name=""value= "Submit"><!--input type reset button defined for reset -<inputtype= "Reset"name=""value= "Reset"></P></form>

HTML inline frame HTML inline frame

The <iframe> tag creates an inline frame (inline frame) containing another HTML file, the SRC attribute defines the reference address of another HTML file, the Frameborder property defines the bounding rectangle, and the scrolling property defines whether there is a scroll bar, and the code is as follows:

<src= "http://www ..."  frameborder= "0"  scrolling  = "No"></iframe>

Inline frames are used with a tag

The target property of the A tag can display the linked page directly in the IFRAME of the current page, with the following code:

<ahref= "01.html"Target= "MyFrame">Page One</a><ahref= "02.html"Target= "MyFrame">Page Two</a><ahref= "03.html"Target= "MyFrame">Page Three</a><iframesrc= "01.html"frameborder= "0"scrolling= "No"name= "MyFrame"></iframe>

HTML (iv)