HTML 的基礎知識是什麼？

已發表: 2023-09-25

HTML（超文本標記語言）是橘郡網頁設計的基本構建塊。它是一種用於創建網頁結構和內容的標記語言，也是所有網站的基礎。可能所有網頁設計師在他們的職業生涯中都遇到過 HTML！

HTML 是用來建立靜態網頁的標準語言，靜態網頁是指不手動編輯 HTML 程式碼就不會改變的頁面，這表示使用者無法影響它。

橙色縣 pinterest 網頁設計中的編碼語言基礎 HTML

HTML 基礎知識

HTML是一組元素或標籤，每個元素代表一個特定的網頁元件。聽起來很簡單，不是嗎？那是因為它是！這些 HTML 文件是使用文字編輯器建立的，並以 .html 副檔名儲存。一個基本的 HTML 文件應該具有以下元素才能正常運作：

<!DOCTYPE> 聲明

<!DOCTYPE> 聲明充當 HTML 文件的開頭，透過通知瀏覽器您正在使用的特定 HTML 版本來做好準備。可以將其視為友好的介紹，“嘿，瀏覽器，我們將隨著 HTML5 的節奏起舞！” HTML5 是當前 Web 開發領域的明星，它帶來了許多令人興奮的功能和改進。因此，當您包含此聲明時，您實際上是在告訴瀏覽器為現代的、功能豐富的 HTML 體驗做好準備。這是確保正確呈現 Web 內容並利用所有超酷 HTML5 功能的方法。

<!DOCTYPE html>

<HTML> 元素

將 <html> 元素視為 HTML 文件中的大老闆。他是頭頭，是最高層的人，也是讓一切井然有序的人。就像老闆管理公司一樣， <html> 元素管理您的整個網頁。它是您將用來建立 Web 內容的所有其他元素的起點和容器。

在此 <html> 元素內，您將找到網頁的藍圖，包括 <head> 和 <body> 元素。 <head> 元素包含有關文件的重要訊息，例如標題、元標記和外部資源的連結。同時，<body>元素包含使用者在造訪您的網站時看到的所有可見內容。

因此，簡而言之，<html> 元素是 HTML 文件的大局、總司令和最終組織者。它確保一切順利進行，並確保您的網頁結構正確並正確呈現給您的受眾。

<Head> 元素

<head> 元素就像文件的大腦，保存重要訊息，如標題、元標記以及指向樣式表和腳本等精美內容的連結。因此，雖然 <head> 元素在您的網頁上可能不可見，但它在確保您的網站美觀、性能良好以及與用戶和搜尋引擎有效溝通方面發揮著至關重要的作用。它就像指揮中心一樣，幫助您的網頁發揮最佳功能。

<標題> 元素

<title> 元素指定文件的標題，該標題顯示在瀏覽器的標題列中。它不僅是一項技術要求，也是一個強大的溝通工具。製作清晰、簡潔且相關的標題對於確保您的網頁易於識別、存取並對用戶和搜尋引擎有吸引力至關重要。

<Body> 元素

<body>元素包含了網頁的所有內容，例如文字、圖像、影片等元素。它就像劇院的主舞台 — HTML 文件中的所有動作都在這裡發生。它是任何網頁的基本構建塊之一，其作用非常簡單但至關重要：它包含用戶在訪問網站時看到的所有可見內容。

HTML 元素

HTML 元素包含在開始和結束標籤中，並用尖括號括起來。開始標記以元素名稱開頭，後面跟著名稱/值對形式的任何屬性。結束標記與開始標記完全相同，但它在元素名稱之前有一個正斜線 (/) 作為一種結束註釋。

例如，以下程式碼會建立一個簡單的 HTML 頁面：

<!DOCTYPE html>

<html>

<頭>

<title>我的第一個 HTML 頁面</title>

</頭>

<正文>

<h1>歡迎來到我的網站</h1>

<p>這是我的第一個 HTML 頁面。</p>

</正文>

</html>

這裡，<html>元素是根元素，它包含<head>和<body>元素。 <head> 元素包含 <title> 元素，它指定文件的標題。 <body> 元素包含頁面內容，其中包括標題和段落。在典型的 HTML 文件中，您應該先從最大的元素（在本例中為 HTML）開始，然後在建立頁面時轉到較小的元素（例如，頭部、標題、正文等）。

HTML 屬性

HTML 屬性提供有關元素的附加信息，並包含在開始標記中。它們有點像描述符。最常見的屬性包括以下：

ID 屬性

id 屬性標識一個元素，並在 JavaScript 和 CSS 中操作該元素。

類別屬性

class 屬性將元素組合在一起，允許使用 CSS 設計它們的樣式。

樣式屬性

style 屬性是一個漂亮的 HTML 功能，可讓您將樣式直接套用到 HTML 程式碼中的單一元素。這就像對特定元素進行時尚改造，指定顏色、字體和間距等內容，而無需創建單獨的樣式表。當您想要對元素的外觀進行快速、一次性的更改而不影響網站的其餘樣式時，這會很方便。因此，它是您為網頁設計中的特定元素添加獨特性的首選工具。

Href 屬性

href 屬性在連結中用於指定目標頁面的 URL。

結論

HTML 是網頁設計的基礎，對於創建結構良好的網頁至關重要。它們是建立成熟網站的第一步！因此，了解 HTML 的基礎知識對於任何想要建立網站的人來說都是至關重要的。 HTML 是一種標記語言，由元素、屬性和內容組成。每個元素代表網頁的特定元件，屬性提供有關元素的附加資訊。使用 HTML，您可以建立一個結構化的、具有視覺吸引力的互動式網站。

請參閱此處的相關文章：https://www.drivetrafficmedia.com/the- Different-coding-languages-of-web-design/

希拉