本小節重點： 熟練使用div+span布局，知道div和span的語義化的意思 熟悉對div、ul、li、span、a、img、table、form、input標簽有深刻的認知，初期也了解他們，知道他們在瀏覽器上的初始化樣式是怎樣的。 熟練網站布局結構 比如 header區域，側邊欄區域，內容區域，腳部區域
- 查詢一下對div和span標簽的理解
- 如何理解標簽的嵌套結構？它們的規則是怎樣的？
- 如果給你一個網站，讓你只用div來畫塊的畫，如何畫？比如京東
- 一個html文件包含幾部分？
- 當使用p標簽的使用，應該注意什么？
- 闡述一下form標簽的作用？form標簽的屬性有哪些？
- ul的孩子元素一定是li么？
- 如何理解語義化的標簽？
- 標簽的分類
1、查詢一下對div和span標簽的理解
div是塊級元素，在沒有任何布局屬性作用時，默認排列方式是換行排列
span是行內元素、內聯元素，在沒有任何布局屬性，默認是同行排列
編程題：
代碼：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>百度注冊</title> </head> <body> <dir > <form action="https://www.baidu.com" method="post"> <p> <label for="user">用戶名</label> <input type="text" name="username" id="user" placeholder="請設置用戶名"> </p> <p> <label for="user">手機號</label> <input type="number" name="phone_number" id="phone_number" placeholder="可用於登錄和找回密碼"> </p> <p> <label for="user">密碼</label> <input type="password" name="password" id="pwd" placeholder="可設置登錄密碼"> </p> <p> <label for="user">驗證碼</label> <input type="number" name="驗證碼" id="驗證碼" placeholder="請輸入驗證碼"> <input type="button" name="btn" value="獲取短信驗證碼"> </p> <p> <input type="radio" value="閱讀並接受">閱讀並接受 <a href="#" >《百度用戶協議》</a> <a href="#" >《百度隱私權保護聲明》</a> </p> </form> <dir> <p> <input type="submit" value="注冊" style="height: 50px;width: 200px" > </p> </dir> </dir> </body> </html>
運行結果：
