html tag review
- html is an interpreted language, not a compiled one. Browsers are fault tolerant.
- The html page consists of a pair of tags:
<html></html> <html> Call it the start tag </html>Call it the end tag
3.title refers to the title of the web page
4. You can set the encoding method in the meta tag
5. <br/> indicates line feed. Br a label is a single label. Single label: the start label and the end label are the same, and the slash is placed after the word
6. p indicates paragraph label
7.img label picture label
- The src attribute indicates the path of the picture file
- width and height indicate the size of the picture
- alt indicates the prompt of the picture
- h1~h6: title label
- List label:
- ol ordered list
Start means to start from *, and the type displayed by type: a a I I 1 (deault) - ul unordered list
type disc(default) , circle , square
- u underline b bold i Italic
- Superscript sup subscript sub
- Entities in HTML: less than sign < greater than or equal sign ≥ copyright ©
- span block mark without line breaks
- a means hyperlink
- href linked address
- target:
- _ self opens in this window
- _ blank opens in a new window
- _ Parent opens in the parent window
- _ Top opens in the top window
- target:
<html> <head> <title>This is my first web page</title> <meta charset="UTF-8"> </head> <body> <!-- HELLO WORLD!<br/>Hello, HTML! <p>Here is a paragraph</p> <p>Here is the second paragraph</p> <img src="D:\sgg2021\0927_javaweb\1109\02.code\imgs\girl.jpg" width="57" height="73" alt="Here is a picture"/> <h1>Title I</h1> <h2>Title I</h2> <h3>Title I</h3> <h4>Title I</h4> <h5>Title I</h5> <h6>Title I</h6> --> Ranking list of Wulin Masters: <ol type="i" start="3"> <li>Sweeping monk</li> <li>Xiaoyuanshan</li> <li>Murongbo</li> <li>Phyllostachys pubescens</li> <li>Azzi</li> </ol> List of Wulin assembly personnel: <ul type="circle"> <li>Qiao Feng</li> <li>Aju</li> <li>Madame Ma</li> <li>Baishijing</li> </ul> You are?<b><i><u>like</u></i></b>yes<b>sweet</b>Moon cake or<i>salty</i><u>Moon Cake</u>？ <br/> Chemical formula of water molecule: H<sub>2</sub>O <br/> Chemical formula of oxygen: O<sup>2</sup><br/> 5<10 10>5 5≤10 10≥5 Registered trademark ® Copyright symbol © <span>You Ting Zhao</span>，Take revenge on your wife. <a href="http://www.baidu. com" target="_ Self "> Baidu</a> </body> </html>
Centered picture:
table label
-
Table table
Row tr
Column td
Header column thtable has the following attributes (although it has been eliminated, it is best to understand it)
- Border: the thickness of the table border
- Width: width of the table
- cellspacing: cell spacing
- cellpadding: cell filling
tr has an attribute: align - > center, left, right
rowspan: row merge
colspan: column merge
<html> <head> <title>Form label learning</title> <meta charset="UTF-8"> </head> <body> <table border="1" width="600" cellspacing="0" cellpadding="4"> <tr align="center"> <th>full name</th> <th>Sect</th> <th>Famous stunt</th> <th>Internal skill value</th> </tr> <tr align="center"> <td>Qiao Feng</td> <td>a group of beggars</td> <td>Shaolin Changquan</td> <td>5000</td> </tr> <tr align="center"> <td>Phyllostachys pubescens</td> <td>Lingjiu Palace</td> <td>Beiming magic skill</td> <td>15000</td> </tr> <tr align="center"> <td>Sweeping monk</td> <td>Shaolin Temple</td> <td>Seventy two unique skills</td> <td>unknown</td> </tr> </table> <hr/> <table border="1" cellspacing="0" cellpadding="4" width="600"> <tr> <th>name</th> <th>Unit Price</th> <th>quantity</th> <th>Subtotal</th> <th>operation</th> </tr> <tr align="center"> <td>Apple</td> <td rowspan="2">5</td> <td>20</td> <td>100</td> <td><img src="imgs/del.jpg" width="24" height="24"/></td> </tr> <tr align="center"> <td>pineapple</td> <td>15</td> <td>45</td> <td><img src="imgs/del.jpg" width="24" height="24"/></td> </tr> <tr align="center"> <td>watermelon</td> <td>6</td> <td>6</td> <td>36</td> <td><img src="imgs/del.jpg" width="24" height="24"/></td> </tr> <tr align="center"> <td>total</td> <td colspan="4">181</td> </tr> </table> </body> </html>
Form form
1.input type= "text" indicates a text box, in which the name attribute must be specified, otherwise the data in this text box will not be sent to the server in the future
2. input type= "password" indicates the password box
3. input type= "radio" means radio button. It should be noted that the value of the name attribute is consistent, which will have the effect of mutual exclusion; You can set the items selected by default through the checked attribute
4. input type= "checkbox" indicates a check box. It is recommended to keep the value of the name attribute consistent, so that when we get the value on the server in the future, we will get an array
5. select indicates the drop-down list. Each option is option, where the value attribute is the value sent to the server, and selected indicates the item selected by default
6. textarea refers to a multi line text box (or text field), and its value value is the content between the start and end labels
7. input type= "submit" indicates the submit button
8. input type= "reset" indicates the reset button
9. input type= "button" indicates a normal button
<html> <head> <title>Form label learning</title> <meta charset="UTF-8"> </head> <body> <form action="demo04.html" method="post"> Nickname?<input type="text" value="Please enter your nickname"/><br/> password:<input type="password" name="pwd"/><br/> Gender:<input type="radio" name="gender" value="male"/>male <input type="radio" name="gender" value="female" checked/>female<br/> Hobbies:<input type="checkbox" name="hobby" value="basketball"/>Basketball <input type="checkbox" name="hobby" value="football" checked/>Football <input type="checkbox" name="hobby" value="earth" checked/>earth<br/> Constellation:<select name="star"> <option value="1">Aries</option> <option value="2" selected>Taurus</option> <option value="3">Gemini</option> <option value="4">scorpio</option> <option value="5">libra</option> </select><br/> remarks:<textarea name="remark" rows="4" cols="50"></textarea><br/> <input type="submit" value=" Register "/> <input type="reset" value="Reset"/> <input type="button" value="This is a normal button"/> </form> </body> </html>
