欧美成人精品手机在线观看_69视频国产_动漫精品第一页_日韩中文字幕网 - 日本欧美一区二区

LOGO OA教程 ERP教程 模切知識交流 PMS教程 CRM教程 開發文檔 其他文檔  
 
網站管理員

HTML 21 天入門:入門準備

admin
2024年10月19日 22:9 本文熱度 445

HTML 基本介紹

什么是 HTML

HTML 全稱為 Hyper Text Markup Language,翻譯過來就是超文本標記語言

這個名稱拆開來看,分成 超文本 和 標記語言 兩部分。

標記語言,說明它并不是一門編程語言。

而超文本,從字面意思來理解,是超越文本的意思。

文字,寫在紙上成書,展示在電腦里稱為文本。超文本,指比文字更豐富的表達形式,直接理解成超越了文本。比如,現在很常見的圖形,音頻,視頻。

現在這些東西已經是司空見慣,而在互聯網開始之初,受限于網絡傳輸能力,文字才是信息傳遞的主要載體,而 HTML 的橫空出世,徹底打破了只有文字的時代。現在我們看到的精彩紛呈的網頁呈現,都是從 HTML 開始的。

如何創建 HTML 文檔

使用 HTML 編寫的文檔,稱為網頁文件,通常命名為.html 或.htm,這兩種后綴名沒有區別。

任意文本編輯器都可以拿來編寫網頁文件,比如 windows 下的記事本(notepad)。當然,現在已經有了非常強大的 IDE (Integrated Development Environment),也就是集成開發環境,比如 VSCode,它提供了很多輔助功能,用以幫助我們提高工作效率。

作為初學者,建議多敲代碼,少使用聯想和補齊,就更不要說使用 AI 之類的。這些功能可以在學成之后幫助我們提高工作效率。

HTML 要在哪里運行

創建好的 HTML 網頁,可以通過瀏覽器訪問,可以是電腦上的,也可以是手機,平板等其它設備上的。

對于存儲在本地磁盤里的網頁,也可以通過磁盤路徑訪問,也就是類似 C://HTML/Default.html 這種形式。這種稱為本地運行。

而對于在互聯網上訪問的網頁,是基于網址的,比如https://baidu.com,是一個網址,這個網址背后的網頁,托管運行在互聯網某個我們不知道的機器上,這樣的機器我們稱為服務器,這種訪問通過網址訪問的網頁,就是服務器運行的。

以前在學習 HTML 時,由于一系列的限制,大多采用本地運行的方式。但隨著工具的革新,我們有了更方便的方式。在隨后的章節里,會講述如何使用插件幫助我們在本地模擬服務器運行網頁,這樣就能得到一個即時刷新的運行環境,更加方便我們的學習。

開發環境準備

相信大家對 HTML 已經有了一個初步的認識,對于開發環境,我們只需要編輯器和瀏覽器。

編輯器用于編寫網頁,瀏覽器用于運行網頁。

編輯器

互聯網上的工具千千萬,這里就直接推薦使用目前最流行的 VSCode 進行學習,能無縫接軌后續的深入學習。

當然如果不想使用 VSCode,可以使用相對比較輕便的編輯器 Nodepad++或其它任何你喜歡的文本編輯器。

?? 本教程中所有的示例都使用 VSCode 進行。

Live Server 插件

使用 VS Code 的好處,是它有著非常豐富的插件,這些插件方便我們的日常工作。

雖然在學習階段并不推薦使用,但有一個插件,可以幫助我們更專注于學習,它就是 Live Server。

  • 安裝“Live Server”插件

    ?

    在 VS Code 的擴展里,如下圖,搜索“Live Server”,找到對應的插件,點擊“安裝”按鈕,安裝之后,便如下圖。


    安裝完這個插件之后,暫時不需要做什么,在后面會介紹如何使用。

瀏覽器

使用主流的瀏覽器即可,比如 Chrome, FireFox, Edge 等等。

當然這兩樣東西,都需要運行在電腦上,所以首先要準備一臺電腦。

對于學習來說,配置不需要高,操作系統也沒有限制。你熟悉哪個用哪個。

?? 本教程中所有的 HTML 頁面都編寫運行在 Windows 操作系統上。

我的第一個頁面:Hello World

好了,現在我們可以開始試著運行一下我的第一個頁面了。放心,只是運行,暫時不需要理解。

在開始前,咱們先在電腦上建立一個專門的目錄來存放我們的頁面,比如說 C 盤根目錄下,目錄名稱為html-learning

?? 本教程中所有的 HTML 頁面運行都將在該目錄下展示。

  • 打開 VSCode,在文件 -> 打開目錄 定位到剛才創建的目錄。

  • 新建一個新文檔,命名成 1.html。

  • 拷貝下面代碼到 1.html。

    <!DOCTYPE html> <html lang="en">   <head>     <meta charset="UTF-8" />     <meta name="viewport" content="width=device-width, initial-scale=1.0" />     <title>我的第一個頁面</title>   </head>    <body>     Hello World   </body> </html> 
  • 還記得剛才咱們安裝的 Live Server 插件嗎,現在該使用了。在 VS Code 右下角,有 Go Live 圖標,點擊一下。


  • 看到如下,則表明起動成功。


  • 打開瀏覽器,在地址里輸入地址 http://localhost:5500/。然后在頁面顯示里點擊 1.html,看到如下截圖顯示,說明咱們就成功啦。

本節內容結束。恭喜。

總結

  • ?? HTML 全稱為 HyperText Markup Language,是一種用于創建網頁的標準標記語言。

  • ?? HTML 開發使用普通的文本編輯器即可,推薦目前最流行的 VSCode。

  • ?? HTML 運行在瀏覽器里,使用 VS Code 插件 Live Server 可以模擬生成本地服務器運行本地的頁面。


該文章在 2024/10/22 12:41:35 編輯過
關鍵字查詢
相關文章
正在查詢...
點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。
點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理,結合碼頭的業務特點,圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體,是物流碼頭及其他港口類企業的高效ERP管理信息系統。
點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。
點晴免費OA是一款軟件和通用服務都免費,不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。
Copyright 2010-2025 ClickSun All Rights Reserved