把html设置为桌面项目_如何设置HTML项目

痛定思痛。 2022-11-28 15:21 213阅读 0赞

把html设置为桌面项目

**[How To Build a Website With HTML][] [如何使用HTML构建网站][How To Build a Website With HTML]**

This tutorial series will guide you through creating and further customizing [this website][] using HTML, the standard markup language used to display documents in a web browser. No prior coding experience is necessary but we recommend you start at the [beginning of the series][How To Build a Website With HTML] if you wish to recreate the demonstration website.

本教程系列将指导您使用HTML(用于在Web浏览器中显示文档的标准标记语言)创建和进一步自定义[此网站][this website] 。 不需要任何编码经验，但是如果您希望重新创建演示网站，建议您从[本系列][How To Build a Website With HTML]的[开头开始][How To Build a Website With HTML] 。

At the end of this series, you should have a website ready to deploy to the cloud and a basic familiarity with HTML. Knowing how to write HTML will provide a strong foundation for learning additional front-end web development skills, such as CSS and JavaScript.

在本系列的最后，您应该拥有一个可以部署到云的网站，并且对HTML有了基本的了解。 知道如何编写HTML将为学习其他前端Web开发技能(例如CSS和JavaScript)奠定坚实的基础。

To explore HTML in practice and begin building an HTML website, we’ll need to set up a new project using a text editor. This tutorial series uses [Visual Studio Code][], a free code editor available for Mac, Windows, or Linux, but you may use whichever code editor you prefer.

为了在实践中探索HTML并开始构建HTML网站，我们需要使用文本编辑器设置一个新项目。 本教程系列使用[Visual Studio Code][] (可用于Mac，Windows或Linux的免费代码编辑器)，但是您可以使用任何喜欢的代码编辑器。

After opening your preferred text editor, open up a new project folder and name it `html-practice`. We’ll use this folder to store all the files and folders we create in the course of this tutorial series.

打开首选的文本编辑器后，打开一个新的项目文件夹，并将其命名为`html-practice` 。 我们将使用此文件夹存储在本系列教程中创建的所有文件和文件夹。

To create a new project folder in Visual Studio Code, navigate to the “File” menu item in the top menu and select “Add Folder to Workspace.” In the new window, click the “New Folder” button and create a new folder called `html-practice` as illustrated in the gif below:

要在Visual Studio Code中创建新的项目文件夹，请导航到顶部菜单中的“文件”菜单项，然后选择“将文件夹添加到工作区”。 在新窗口中，单击“新建文件夹”按钮，然后创建一个名为`html-practice`的新文件夹，如下gif所示：

Next, create a new file called `index.html` inside the `html-practice` folder. We’ll use this file through the tutorial series to experiment with HTML. If you are using Visual Studio Code, you can create a new file by using `Right Click`(on Windows) or `CTRL + Left Click` (on Mac) on the `html-practice` folder, selecting “New File”, and creating the file `index.html` as illustrated in the gif below:

接下来，在`html-practice`文件夹中创建一个名为`index.html`的新文件。 在整个教程系列中，我们将使用此文件来尝试HTML。 如果使用的是Visual Studio Code，则可以通过使用`html-practice`文件夹上的`Right Click` (在Windows上)或`CTRL + Left Click` (在Mac上)，选择“新建文件”并创建文件`index.html`创建新文件`index.html`如下gif中所示的`index.html` ：

You now have a project folder and file for exploring HTML. We’ll return to this file in the tutorials ahead.

现在，您有了用于浏览HTML的项目文件夹和文件。 我们将在前面的教程中返回此文件。

### 关于调试HTML的快速说明 **(**A Quick Note on Debugging HTML**)** ###

Before we get started with our HTML exercises, be aware that precision is important when writing HTML. Even an extra space or mistyped character can keep your code from working as expected.

在开始HTML练习之前，请注意，编写HTML时，精度很重要。 甚至多余的空格或键入错误的字符也可能会使您的代码无法按预期工作。

If your HTML code is not rendering in the browser as intended, make sure you have written the code exactly. To troubleshoot errors, check for extra or missing spaces, missing or misspelled tags, and missing or incorrect punctuation or characters. Each time you change your code, make sure to save your file before reloading it in the browser to check your results.

如果您HTML代码未按预期在浏览器中呈现，请确保已正确编写了代码。 要解决错误，请检查是否有多余或缺失的空格，标记是否缺失或拼写错误以及标点符号或字符是否缺失或不正确。 每次更改代码时，请确保保存文件，然后再将其重新加载到浏览器中以检查结果。

> 翻译自: [https://www.digitalocean.com/community/tutorials/how-to-set-up-your-html-project][https_www.digitalocean.com_community_tutorials_how-to-set-up-your-html-project]

把html设置为桌面项目

[How To Build a Website With HTML]: https://www.digitalocean.com/community/tutorial_series/how-to-build-a-website-with-html
[this website]: http://html.sammy-codes.com/
[Visual Studio Code]: https://code.visualstudio.com/
[https_www.digitalocean.com_community_tutorials_how-to-set-up-your-html-project]: https://www.digitalocean.com/community/tutorials/how-to-set-up-your-html-project