Notes: html foundation

A, HTML: Hypertext Markup Language, is a markup language, not a programming language, the display data has ditag <body> </ body> tag and a single <img src = # />, the label can be the case
through the browser parsing the HTML code, the data tags <body> will be displayed

< IDOCTYPE HTML > 
< HTML > 
    < head > 
        title> </ title > title
     </ head > 
    < body > 
        Display Data 
    </ body > 
</ HTML >  

Two, HTML tags commonly used

< H1 of > ------> < H6 > Title 
    Example: < h1 of > This is the title. 1 < h1 of > 
< HR >                 horizontal
 < br >                 wrapping
 < title > </ title >   Title header
 < Meta charsent = "UTF -8 " >    use utf-8 character encoding
 < Script of the type =" text / javascrpe " >    pop-up window on the page 
    Alert ( " you have been attacked . ")
</script> 
< P > </ P >          paragraph tag will wrap
 < A > </ A >    link label Example: < A the href = "https://www.baidu.com" > Baidu, </ A > 
< IMG />      Example image tag: < img src = "picture address"  />  </ img > 
< img src = # width = "1000" height = "1000" >   change the image size
 - <!  ->       comment tags

Third, the table

< Table border = ". 1" cellspacing = "10" cellpadding = "10" > 
    <-! Width represents the width of the table 
        thickness of the outer border of the border showing 
        the inner border and an outer border spacing cellspadding size 
        from the inner border and data content cellpadding 
    -> 
    < TR > 
        < TH > <-! header (will be centered bold) -> 
        </ TH > 
    </ TR > 
    < TR > <-! indicates a row -> 
        < TD style = " 
            font -synthesis:;Font 
            font-size:; font size
            Color color :; word
            border-bottom: 1px dashed #ccc; plus a dotted line " > <! - represents a column -> 

            this is a table 

            & nbsp     denote spaces 

        </ TD > 
    </ TR > 
</ Table >        

  1, merged column

<table border="1">
    <tr>
        <td colspan="2">1</td><!-- colspan 用于合并列 -->
        
    </tr>
    <tr>
        <td>3</td>
        <td>4</td>
    </tr>
</table>    

  2. Consolidated row

<table border="1">
    <tr>
        <th>name</th>
        <th>age</th>
        <th>addr</th>
    </tr>
    <tr>
        <td>张三</td><!-- rowspan 用于合并行 -->
        <td rowspan="2">24</td>
        <td>qwe</td>
    </tr>
    <tr>
        <td>李四</td>
        
        <td>asd</td>
    </tr>
</table>

  3, the list of order-disorder

< Table > 
    < UL > <-! Unordered list -> 
        < Li > first </ Li > 
        < Li > second </ Li > 
    </ UL > 

    < OL > <-! Ordered list - > 
        < Li > first </ Li > 
        < Li > second </ Li > 
    </ OL >  
</ Table >   

  4, Form

Form: collect user information < br > 
< form name = "input_data" Action = "index.php" Method, = "GET" > 
    <-! 
        Action: submitting data to indicate which page 
        method: submission of data, get ( splicing data parameter url), POST (parameter data in the requested content, the data transmitted in the url not seen) -> 
    < label > name: </ label > 
    < INPUT type = "text" name = "name" > <! - text field -> 
    < br > 
    < label > password: </label>
    <input type="password" name="pwd">
    <br>
    <input type="radio" name="gender" value="1"><br>  <!--按钮-->
    <input type="radio" name="gender" value="0"><br>
    <input type="radio" name="gender" value="01">br<Do not know>

    爱好:<br>
    <input type="checkbox" name="aihao" value="lanqiu">篮球<br>
    <input type="checkbox" name="aihao" value="zuqiu">足球<br>
    <input type="checkbox" name="aihao" value="pingpangqiu">乒乓球<br>

    提交:
    <input type="submit" name="sub" style="" value="提交"><br>
</form>

 

Guess you like

Origin www.cnblogs.com/yuanshu/p/11563198.html