【HTML学习】——一个网页HTML编程的构成
生活随笔
收集整理的這篇文章主要介紹了
【HTML学习】——一个网页HTML编程的构成
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
目錄
1、html網(wǎng)頁構(gòu)成介紹
?2、HTML標(biāo)簽介紹
全部的html標(biāo)簽：
HTML: HyperText Markup Language | MDNhttps://developer.mozilla.org/en-US/docs/Web/HTML
?
一個網(wǎng)頁文件一般由.html結(jié)尾的文件組成，主要由不同的標(biāo)簽對和內(nèi)容組成，常見的html標(biāo)簽可以參見文章：
原創(chuàng) 【HTML學(xué)習(xí)】——HTML常見標(biāo)簽屬性和方法介紹?https://blog.csdn.net/qq_45769063/article/details/122149454
1、html網(wǎng)頁構(gòu)成介紹
?
?2、HTML標(biāo)簽介紹
常見的tag如下所示
<!--html聲明--> <!DOCTYPE html><!--HTML標(biāo)簽--> <html lang="en"> <!--head標(biāo)簽，主要是設(shè)置顯示在網(wǎng)頁標(biāo)簽頁的標(biāo)題等屬性--><head><!--設(shè)置網(wǎng)頁標(biāo)題以及字符集格式，這里設(shè)置的字符集格式為utf-8--><meta charset="UTF-8"><title>第一個網(wǎng)頁</title> </head><!--網(wǎng)頁主體部分的內(nèi)容--> <body><!--顯示不同大小的標(biāo)題，從h1-h6--> <h1>heading one</h1> <h2>heading two</h2> <h3>heading two</h3> <h4>heading three</h4> <h5>heading four</h5> <h6>heading five</h6><!--文本--> <p>文本</p><!--從網(wǎng)頁中鏈接圖片顯示在自己的網(wǎng)頁中--> <img src="https://img-blog.csdnimg.cn/20210904124537781.png" width="200" height="200"/><!--無序列表，前面加點list--> <ul><li>list 1</li><li>list 2</li><li>list 3</li><li>list 4</li><li>list 5</li> </ul><!--有序列表，前面加數(shù)字--> <ol><li>list 1</li><li>list 2</li><li>list 3</li><li>list 4</li> </ol><!--表格--> <table><!--表頭--><thead><!--tr：table row以橫向的形式呈現(xiàn)--><tr><!--設(shè)置表頭信息<--><th>First name</th><th>last name</th><th>age</th><th>email</th></tr></thead><!--表格主體內(nèi)容--><tbody><tr><!--設(shè)置表格數(shù)據(jù)--><td>lily</td><td>chan</td><td>12</td><td>123@qq.com</td></tr><tr><!--設(shè)置表格數(shù)據(jù)--><td>lily</td><td>chan</td><td>12</td><td>123@qq.com</td></tr><tr><!--設(shè)置表格數(shù)據(jù)--><td>lily</td><td>chan</td><td>12</td><td>123@qq.com</td></tr></tbody> </table><!--表單，action指定處理邏輯的文件，method指定數(shù)據(jù)傳遞方式--> <form action="form_logic.py" method="post"><!--占用一個區(qū)塊--><div><!--label--><label>first name</label><!--定義一個輸入文本框，用于用戶輸入--><input type="text" name="first name"></div><div><!--label--><label>last name</label><!--定義一個輸入文本框，用于用戶輸入--><input type="text" name="email"></div><div><!--label--><label>email</label><!--定義一個輸入文本框，用于用戶輸入--><input type="text" name="email"></div><!--提交按鈕--><input type="submit" value="Submit"> </form> <!--按鈕--> <button>This is a Button</button><!--給指定的字段添加解釋，當(dāng)鼠標(biāo)聚焦在上面字段時，會顯示解釋--> <p><abbr title = "south college of techellge">SCUT</abbr> is a good college</p> <!--設(shè)置下面空1000個像素--> <div style="margin-top: 1000px"></div> </body> </html><!--大部分標(biāo)簽對是成雙成對的，以/作為結(jié)束標(biāo)志-->?
?
?注意：
HTML：只負(fù)責(zé)編寫代碼，將控件等顯示，不負(fù)責(zé)顯示格式和網(wǎng)頁業(yè)務(wù)邏輯處理
CSS：負(fù)責(zé)網(wǎng)頁格式處理，使得網(wǎng)頁顯示更加地美化
業(yè)務(wù)邏輯一般是用Java/Python/js等語言編寫然后在后臺進(jìn)行顯示
總結(jié)
以上是生活随笔為你收集整理的【HTML学习】——一个网页HTML编程的构成的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： axios、ajax和xhr前端发送测试
- 下一篇： JAAS 简介