Comment mettre en place un projet de base HTML, CSS et JavaScript-tutoriel CSS-php.cn

Comment mettre en place un projet de base HTML, CSS et JavaScript

DDD

Libérer： 2024-12-07 15:41:11

original

407 Les gens l'ont consulté

Ce tutoriel s'adresse à ceux qui veulent aller droit au but et simplement monter un projet et commencer à coder.

Créez un dossier pour vos fichiers HTML, CSS et Javascript.

How to set up a basic Html, css and javaScript project

Créez vos fichiers dans le dossier que vous venez de créer

How to set up a basic Html, css and javaScript project
tandis que l'apparence des fichiers peut différer d'un PC à l'autre, assurez-vous que la description du fichier est la même que l'image ci-dessus.

Liez les fichiers Css et JavaScript au fichier Html

Lorsqu'il s'agit de lier des fichiers, il est crucial de prendre note de l'emplacement de chaque fichier dans le dossier. Dans notre cas, les fichiers sont tous au même niveau, ce qui rendrait la liaison simple.

Le contenu de votre fichier html devrait ressembler à ceci
`

 <!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>

Copier après la connexion

Nous allons utiliser 2 balises différentes pour lier les fichiers css et js car ils nécessitent un type de balise différent pour les lier.
pour lier le fichier CSS, nous utilisons le Tag. nous utilisons ensuite les attributs rel et href pour indiquer la relation que le contenu de la balise de lien entretient avec la page et l'emplacement dans lequel se trouve le fichier CSS. Cela ressemble à ceci.

L'étiquette d'encre doit être placée entre l'étiquette de tête.

comme pour le fichier javascript nous utilisons la balise script et le pass à l'emplacement du fichier javascript dans l'attribut src. ça ressemble à ça.

notez que la balise script peut être placée à la fois à l'intérieur de la balise head et de la balise body. Toutefois, à des fins de performances, il est conseillé de placer la balise script au bas de la balise body afin qu'elle soit analysée en dernier. Elle peut également être placée dans la balise head. tag avec soit le

Attributs "Async" ou "Defer" ajoutés pour reproduire un comportement de chargement similaire.

Si vous avez suivi les instructions ci-dessus, le contenu de votre fichier html devrait ressembler à ceci.
`

 <!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>

Copier après la connexion

Et maintenant vous disposez d’une configuration HTML, CSS et Javascript très basique. si vous avez des questions ou si vous êtes bloqué, laissez votre question dans la section commentaire et j'y répondrai.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!