「代碼分享」創(chuàng)建HTML文件

下是使用 C# 創(chuàng)建 HTML 文件的代碼示例：

using System;
using System.IO;

namespace CreateHTMLFile
{
    class Program
    {
        static void Main(string[] args)
        {
            // 設(shè)置 HTML 文件路徑及文件名
            string filePath = @"C:\Temp\example.html";

            // 創(chuàng)建一個(gè)新的 HTML 文件
            using (StreamWriter writer = new StreamWriter(filePath))
            {
                // 寫入 HTML 標(biāo)記
                writer.WriteLine("<html>");
                writer.WriteLine("<head><title>Example HTML File</title></head>");
                writer.WriteLine("<body>");

                // 寫入主體內(nèi)容
                writer.WriteLine("<h1>Hello, World!</h1>");
                writer.WriteLine("<p>This is an example HTML file created using C#.</p>");

                // 寫入 HTML 結(jié)束標(biāo)記
                writer.WriteLine("</body>");
                writer.WriteLine("</html>");
            }

            // 輸出成功消息
            Console.WriteLine("HTML 文件已創(chuàng)建：{0}", filePath);
        }
    }
}

此代碼將創(chuàng)建一個(gè)名為 “example.html” 的 HTML 文件，并在其中添加一些基本的元素。你可以根據(jù)需要修改或擴(kuò)展它，以滿足你的具體需求。注意，要?jiǎng)?chuàng)建 HTML 文件，你需要使用 System.IO 命名空間中的 StreamWriter 類。該類允許你向文件寫入文本數(shù)據(jù)。

、html的介紹

1.1 html的定義

HTML 的全稱為：HyperText Mark-up Language, 指的是超文本標(biāo)記語言。標(biāo)記：就是標(biāo)簽, <標(biāo)簽名稱></標(biāo)簽名稱>，比如：<html></html>、<h1></h1>等，標(biāo)簽大多數(shù)都是成對出現(xiàn)的。

所謂超文本，有兩層含義:

因?yàn)榫W(wǎng)頁中還可以圖片、視頻、音頻等內(nèi)容(超越文本限制)
它還可以在網(wǎng)頁中跳轉(zhuǎn)到另一個(gè)網(wǎng)頁，與世界各地主機(jī)的網(wǎng)頁鏈接(超鏈接文本)

1.2 html的作用

html是用來開發(fā)網(wǎng)頁的，它是開發(fā)網(wǎng)頁的語言。

1.3 小結(jié)

html是開發(fā)網(wǎng)頁的語言
html中的標(biāo)簽大多數(shù)都是成對出現(xiàn)的, 格式: <標(biāo)簽名>

二、html的基本結(jié)構(gòu)

2.1 結(jié)構(gòu)代碼

<!DOCTYPE html>
<html>
   <head>            
       <meta charset="UTF-8">
       <title>網(wǎng)頁標(biāo)題</title>
   </head>
   <body>
        網(wǎng)頁顯示內(nèi)容
   </body>
</html>

第一行<!DOCTYPE html>是文檔聲明, 用來指定頁面所使用的html的版本, 這里聲明的是一個(gè)html5的文檔。
<html>...</html>標(biāo)簽是開發(fā)人員在告訴瀏覽器，整個(gè)網(wǎng)頁是從<html>這里開始的，到html結(jié)束,也就是html文檔的開始和結(jié)束標(biāo)簽。
<head>...</head>標(biāo)簽用于定義文檔的頭部,是負(fù)責(zé)對網(wǎng)頁進(jìn)行設(shè)置標(biāo)題、編碼格式以及引入css和js文件的。
<body>...</body>標(biāo)簽是編寫網(wǎng)頁上顯示的內(nèi)容。

2.2 瀏覽網(wǎng)頁文件

網(wǎng)頁文件的后綴是.html或者.htm, 一個(gè)html文件就是一個(gè)網(wǎng)頁，html文件用編輯器打開顯示的是文本，可以用文本的方式編輯它，如果用瀏覽器打開，瀏覽器會按照標(biāo)簽描述內(nèi)容將文件渲染成網(wǎng)頁。

2.3 小結(jié)

三、vscode的基本使用

3.1 vscode 的基本介紹

全拼是 Visual Studio Code (簡稱 VS Code) 是由微軟研發(fā)的一款免費(fèi)、開源的跨平臺代碼編輯器，目前是前端(網(wǎng)頁)開發(fā)使用最多的一款軟件開發(fā)工具。

3.2 vscode 的安裝

下載網(wǎng)址: https://code.visualstudio.com/Download
選擇對應(yīng)的安裝包進(jìn)行下載:

根據(jù)下載的安裝包雙擊進(jìn)行安裝即可，當(dāng)然為了更好的使用 vscode 還可以安裝對應(yīng)的插件。

3.3 vscode 的插件安裝

插件名說明Chinese (Simplified) Language Pack for VS Code中文(簡體)漢化包open in browser右擊在瀏覽器打開html

漢化插件安裝

open in browser插件安裝

注意: 如果在vscode打開的html文檔中右擊沒有出現(xiàn) open in browser 類型的選項(xiàng)，需要把當(dāng)前打開的文件關(guān)掉，重新打開這個(gè)文件就好了。

3.4 vscode 的插件卸載

點(diǎn)擊對應(yīng)安裝的插件，然后再點(diǎn)擊卸載按鈕即可。

3.5 vscode 的使用

打開文件夾創(chuàng)建文件

快速創(chuàng)建html文檔的基本結(jié)構(gòu)

右擊在瀏覽器打開html文檔

3.6 設(shè)置字體大小

3.7 設(shè)置顏色主題

3.8 設(shè)置默認(rèn)瀏覽器[可選]

可以根據(jù)自己的需要設(shè)置默認(rèn)使用的瀏覽器

3.9 小結(jié)

vscode 是由微軟研發(fā)的一款免費(fèi)、開源的跨平臺代碼編輯器
通過資源管理器打開文件夾創(chuàng)建HTML文件，編寫 HTML 代碼
可以根據(jù)需要安裝對應(yīng)的插件
可以設(shè)置字體大小和顏色主題

前一直使用windows系統(tǒng)的電腦，創(chuàng)建文件很簡單，改格式也非常的簡單。但換了蘋果電腦，如何創(chuàng)建一個(gè)HTML文件？卻把我給整蒙了。

首先，為什么mac上不能直接新建文本文件？

因?yàn)閙ac一都是以應(yīng)用的方式來管理文件。

我們在Windows上的習(xí)慣是:找到一個(gè)目錄-->新建文件-->打開對應(yīng)的應(yīng)用-->記錄-->保存。

mac的系統(tǒng)傾向是:打開應(yīng)用程序-->記錄-->找目錄-->保存。

一對比，我們發(fā)現(xiàn)mac并不是不能建文本文件，只是建的過程有些麻煩。

下面我們來看一下詳細(xì)的操作步驟:

一，在訪達(dá)里找到文本編輯器并打開。就看到下圖的樣子。

二，找到左下角新建文稿，點(diǎn)擊，會出現(xiàn)一個(gè)編輯文稿的窗口。

這時(shí)你就可以把你要寫的東西寫在這個(gè)文稿里邊，比如我就寫了一個(gè)簡單的html代碼。

三，找到電腦窗口左上角，文件-->移到...

這里就是把文件移入到你方便找的文件夾里，如下圖，會出現(xiàn)一個(gè)位置下拉框

在這里我把這個(gè)文件存在了桌面上。

四，在訪達(dá)里找到你的文件，右鍵點(diǎn)擊，在菜單欄里找到重新命名。

這時(shí)候你就可以把文件改成html格式。

到這里改成HTML就完成了，然后選擇打開方式，在瀏覽器中打開，這時(shí)候你可能出現(xiàn)了，另外一個(gè)問題。

為什么我的HTML文件在mac瀏覽器打開全是源碼？

如下圖所示:

解決方案如下:

一，打開文本編輯。找到窗口左上角:文本編輯-->偏好設(shè)置

二，設(shè)置兩樣?xùn)|西，注意我紅色圈圈區(qū)域。

新建文稿設(shè)置:把格式改為純文本。

打開和存儲設(shè)置:改成我圈住的勾選樣子

再用瀏覽器打開html文件，就會出現(xiàn)下面的網(wǎng)頁了。

如果有需要的，建議收藏呦！

在線咨詢

上一篇：HTML5 瀏覽器支持
下一篇：備存：各種分割線的Html代碼

您的項(xiàng)目需求

*請認(rèn)真填寫需求信息，我們會在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商