技術分享 | web前端的HTML淺析
本文節選自霍格沃茲測試開發學社內部教材

WEB 就是 World Wide Web 的縮寫,稱之為全球廣域網,俗稱 WWW。對于用戶來說其實就是由多個網頁組合在一起而形成一種服務。
WEB 前端負責展示一個網站當中前臺網頁里的內容。而網頁是由前端工程師使用 HTML 語言編寫而成的一種文件,它里面會包含文字、圖片、超鏈接、音頻、視頻等等這些內容。
HTML 超文本標記語言(Hyper Text Markup Language)就是用來描述網頁的一種計算機語言。
HTML發展
在互聯網最初的時候是沒有 HTML 的,只能通過網絡傳輸最簡單的文字內容。隨著用戶的要求越來越多,同時也隨著技術的不斷發展,就出現了一種可以表達文字內容之外的語言 HTML1.0。后來又慢慢發展到了現在的 HTML5,也就是現在常說的 H5。
HTML查看工具
在測試過程中,有時候需要通過工具去查看對應的 HTML 代碼。在這里可以用瀏覽器自帶的開發者工具,打開這個工具的快捷鍵是 F12。
開發者工具是一個相當強大的工具??梢圆榭葱薷?HTML,還可以調試 JS,可以修改 CSS,還可以查看網絡數據,并且還能進行性能測試,非常的全能。對于 WEB 測試來說,是一個必須要掌握的工具。
要查看 HTML 源碼,只需要進入開發者工具的 Elements 界面。在這里可以對 WEB 頁面上的元素進行定位,并且查看整個 WEB 頁面的 HTML 源碼。
HTML基本結構
基本結構
網頁是通過 HTML 語言來書寫。用 HTML 語言去書寫網頁有一些結構是默認必須存在的, 這個結構就叫做網頁(HTML)骨架。
HTML 基本標簽
標簽就是 HTML 語言的發明者人為定義好的一些“單詞”,不同的標簽代表了不同的功能。
標簽有兩種常見的形式:
單標簽:<標簽名 />
雙標簽:<標簽名稱>
:向瀏覽器聲明當前的文檔是 HTML 類型。
與 之間的文本描述網頁,是網頁當中最大的一個標簽,稱之為根標簽。
與 描述網頁頭部,里面的內容是寫給瀏覽器看的。表示在設置當前網頁的顯示編碼。
與
之間的文本被顯示為標題。與
之間的文本被顯示為段落。
我的第一個網頁
網頁中的內容
HTML 標簽可以擁有屬性。屬性提供了有關 HTML 元素的更多的信息。屬性總是以名稱/值對的形式出現,比如:name=“value”。
屬性的基本格式為:<標簽名 屬性1=“屬性值1” 屬性2=“屬性值2”>
每個標簽都可以擁有多個屬性。屬性必須寫在開始標簽中,位于標簽名的后面。屬性之間不區分順序。標簽名與屬性、屬性與屬性之間使用空格隔開。任何屬性都有默認值,省略該屬性表示使用默認值。
在 HTML 里,屬性也有很多種,比如首先有全局屬性,全局屬性是所有的標簽都可以使用的。然后還有事件屬性,事件大家可以理解為不同的操作。在不同的操作中,也有特殊的屬性可以定義。最后還有各個標簽的一些獨有的屬性。
比如常見的全局屬性有:
class:規定元素的類名
id:規定元素的唯一 id
獲取更多內容:https://qrcode.testing-studio.com/f?from=jianshu&url=https://ceshiren.com/t/topic/16586
點擊查看更多信息
HTML web前端
版權聲明:本文內容由網絡用戶投稿,版權歸原作者所有,本站不擁有其著作權,亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容,請聯系我們jiasou666@gmail.com 處理,核實后本網站將在24小時內刪除侵權內容。
版權聲明:本文內容由網絡用戶投稿,版權歸原作者所有,本站不擁有其著作權,亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容,請聯系我們jiasou666@gmail.com 處理,核實后本網站將在24小時內刪除侵權內容。