更新時間:2022-04-11 10:49:46 來源:動力節(jié)點 瀏覽2628次
本教程中,動力節(jié)點小編將向您介紹一個基本的 HTML 文檔,并教您如何在瀏覽器中查看 HTML 文檔的源代碼。
HTML 用于標記文檔,其中包含指示瀏覽器如何顯示和解釋文檔內(nèi)容的說明。例如,HTML 可以告訴瀏覽器哪些文本內(nèi)容應該被解釋為標題,哪些文本內(nèi)容應該被解釋為段落。HTML 還用于添加圖像并為文本和圖像分配鏈接。這些指令是通過 HTML 標記傳達的,這些標記是這樣編寫的:<tagname>. 許多(盡管不是全部)HTML標簽使用開始標簽和結(jié)束標簽來環(huán)繞它們用于修改的內(nèi)容。
為了了解這些標簽的使用方式,讓我們檢查一段 HTML 代碼。下面的 HTML 代碼顯示了如何使用 HTML 標記來構(gòu)造文本以及添加鏈接和圖像。如果您沒有立即理解標簽,請不要擔心 - 我們將在下一個教程中學習這些標簽。
<h1>Sammy's Sample HTML</h1>
<p>This code is an example of how HTML is written.</p>
<p>It uses HTML tags to structure the text.</p>
<p>It uses HTML to add a <a href="digitalocean.com/community">link</a>.</p>
<p>And it also uses HTML to add an image:</p>
<img src="https://html.sammy-codes.com/images/small-profile.jpeg"/>
此 HTML 代碼在瀏覽器中呈現(xiàn)如下:
您現(xiàn)在應該了解 HTML 示例代碼是如何在瀏覽器中呈現(xiàn)的。接下來,我們將學習如何使用瀏覽器工具查看任何網(wǎng)頁的源代碼。
您遇到的幾乎每個網(wǎng)頁都使用 HTML 來構(gòu)建和顯示 HTML 頁面。您可以使用 Firefox 或 Chrome 等網(wǎng)絡(luò)瀏覽器檢查任何網(wǎng)頁的源代碼。在 Firefox 上,導航到頂部菜單中的“工具”菜單項,然后單擊“Web Developer/Page Source”,如下所示:
在 Firefox 上,您還可以使用鍵盤快捷鍵Command-U查看網(wǎng)頁的源代碼。
在 Chrome 上,這個過程非常相似。導航到頂部菜單項“查看”,然后單擊“開發(fā)人員/查看源代碼”。您也可以使用鍵盤快捷鍵Option-Command-U。
嘗試檢查我們將在本教程系列中構(gòu)建的演示網(wǎng)站的源代碼。您應該會收到一個包含比我們上面的示例更多的 HTML 標記的頁面。如果它看起來勢不可擋,請不要驚慌。在本教程系列結(jié)束時,您應該對如何解釋 HTML 源代碼以及如何使用 HTML 構(gòu)建和自定義您自己的網(wǎng)站有了更好的理解。如果您想了解更多相關(guān)知識,可以關(guān)注一下動力節(jié)點的HTML教程,里面有更豐富的知識等著大家去學習,希望對大家能夠有所幫助。