如何建立基本的 Html、css 和 javaScript 项目

wufei123 2025-01-26 阅读:4 评论:0

本教程适合那些想要开门见山、只设置一个项目并开始编码的人。为 html、css 和 javascript 文件创建一个文件夹。在刚刚创建的文件夹中创建文件虽然文件的外观可能因电脑而异...

本教程适合那些想要开门见山、只设置一个项目并开始编码的人。

为 html、css 和 javascript 文件创建一个文件夹。

在刚刚创建的文件夹中创建文件

如何建立基本的 Html、css 和 javaScript 项目
虽然文件的外观可能因电脑而异，但请确保文件描述与上图相同。

将 css 和 javascript 文件链接到 html 文件

在链接文件时，记下每个文件在文件夹中的位置至关重要。在我们的例子中，文件都位于同一级别，这将使链接直接进行。

html 文件的内容应如下所示
`

 <!doctype html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <title>document</title>
      </head>
      <body>

     </body>
 </html>

我们将使用 2 个不同的标签来链接 css 和 js 文件，因为它们需要不同类型的标签来链接它们。
我们使用标签来链接 css 文件。然后我们使用 rel 和 href 属性来指示链接标签内容与页面的关系以及 css 文件所在的位置。它看起来像这样。

ink 标签应放在 head 标签之间。

对于 javascript 文件，我们使用 script 标签并在 src 属性中传递 javascript 文件的位置。看起来像这样。

请注意，脚本标签可以放置在 head 标签和 body 标签内，但是出于性能目的，建议将 script 标签放置在 body 标签的底部，这样它最后被解析。它也可以放置在 head 中带有

的标签添加“异步”或“延迟”属性以复制类似的加载行为。

如果您按照上面的说明进行操作，则 html 文件的内容应如下所示。
`

 <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <title>Document</title>
         <link rel="stylesheet" href="index.css" />
      </head>
      <body>
         <script src="index.js" ></script>
     </body>
 </html>

现在你已经有了一个非常基本的 html、css 和 javascript 设置。如果您有任何疑问或遇到困难，请在评论部分留下您的问题，我会回复。

以上就是如何建立基本的 Html、css 和 javaScript 项目的详细内容，更多请关注知识资源分享宝库其它相关文章！