HTML basic notes, html notes

HTML basic notes, html notes

1. Basic webpage structure:

1 
Note: In HTML, most tags appear in pairs. Start and end
If it is not a paired tag, add/after the tag to end the process.
Ii. Basic tags
1. h1-h6 title label
2. em italics
3. strong bold
4. hr cutting line
5. br line feed
6. p Paragraph label
7. & nbsp; special symbol, space
8. & gt; special symbols,>
9. & lt; special symbols, <
10. & quot; special symbols ,"
11. & copy; special symbols and copyright symbols
12. <! --> Comment
13. img image tags
Property: src: Image path; alt: Text displayed when the image cannot be found
Title: Text displayed by hovering the cursor
Usage:

14. A hyperlink tag
Property: href: Link to where to go
Usage:
<A src = "..."> link </a>
Anchor
Write <a name = "? "> </A>
Write <a href = "? "> </A>
Click this link to find this? Location

Usage:
<A name = "? "> Here is the link. </a>
<A href = "? "> From this link </a>

15. unordered ul-li list
Usage:
<Ul>
<Li> Item 1 </li>
.......
<Li> list item n </li>
</Ul>

Note: There is no order. Each li is a row.
By default, each li has a small solid dot before it.

16. ol-li ordered list
Usage:
<Ol>
<Li> Item 1 </li>
.......
<Li> list item n </li>
</Ol>
Is to replace the solid dot of the unordered list with the serial number

17. dl-dt-dd definition list
Usage:
<Dl>
<Dt> Title 1 </dt>
<Dd> content 1 </dd>
<Dt> Title 2 </dt>
<Dd> content 2 </dd>
</Dl>

Effect:
Title 1
Content 1
Title 2
Content 2
18. form elements
A. text single-line text box
B. password box
C. radio button
D. file Selector
E. checkbox check box
F. select drop-down list
G. submit button
H. reset button
I. textarea text field
Usage:
<Textarea cols = "50" rows = "20">
12345678941515641
</Textarea>
J. form label submission label
Syntax:
<Form method = "submission method" action = "where to submit">

</Form>
If the action is empty, the request is submitted to the current page.
Method optional attributes: post and get
The post is highly secure and the submitted information is not displayed in the address bar.
Get is less secure. The submitted information is displayed in the address bar.
If the method attribute is not written, the default value is get.
Optional values of k and input labels: form Element a-I
L select drop-down list
Usage:
<Select>
<Option> 2016 </option>
<Option> 2015 </option>
<Option> 2014 </option>
</Select>
M, <label> name: <input type = "text"/> </label> join form
Purpose: Click the word "name" and the mouse will focus on the text box behind the name.

3. Note:
1. The tag name should be in lower case.
2. HTML tags should be closed (ended)
3. labels should be correctly nested

Iv. Form attributes
1. readonly = "readonly" Read-Only
2. disabled = "disabled" disabled

V. Table
1. What is a table?
The simplest thing is the queue. You can write between tables.

2. How to use a table?
Draw a large box, draw each line, and then draw each column
<Table>
<Tr>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> </td>
<Td> </td>
</Tr>
</Table>
3. Data or elements can be stored in td.

4. table attributes:
Width: Set the width.
Border: border Width
Align: align, the most common, center, and horizontal alignment
Valign: Alignment mode. The most common one is center. The upper and lower alignment modes are supported.
Cellspacing = "20": the distance between the grid and the grid. The default value is 0.
Cellpadding = "20": the distance between the content and the grid. The default value is 0.
Bgcolor: change the background color.

5. Merge:
Colspan = "2": Merge cells horizontally
Rowspan = "2": Merge cells, vertical merge