Maison > interface Web > js tutoriel > Comment fonctionnent HTML, CSS et JavaScript

Comment fonctionnent HTML, CSS et JavaScript

王林
Libérer: 2024-07-30 07:18:23
original
385 Les gens l'ont consulté

Qu’est-ce que le HTML ?

HTML est l'abréviation de HyperText Markup Language. Je sais que c'est long, mais fondamentalement, nous utilisons HTML pour définir la structure ou les éléments constitutifs de nos pages Web.

Qu’est-ce que CSS ?

CSS est l'abréviation de Feuilles de style en cascade. Nous l'utilisons pour styliser les pages Web et les rendre belles.

Qu'est-ce que JavaScript ?

JavaScript est utilisé pour ajouter des fonctionnalités aux pages Web. Laissez-moi vous donner une analogie.

Pensez à un bâtiment.

How HTML, CSS, and JavaScript Work

Un bâtiment dans le monde réel est comme une page Web sur Internet. Il a un squelette ou une structure – la charpente et les fondations du bâtiment (HTML).

Il peut également avoir de jolis murs, fenêtres et carrelages qui le terminent et lui donnent une belle apparence (CSS).

How HTML, CSS, and JavaScript Work

Et il peut avoir certaines fonctionnalités, comme être une maison, un hôpital ou un supermarché (JavaScript).

How HTML, CSS, and JavaScript Work

Par exemple, lorsqu'on appuie sur le bouton de l'ascenseur, celui-ci vient nous chercher. JavaScript permettrait cela dans notre analogie.

Un vrai exemple

Voici un exemple réel. Disons que vous souhaitez créer un site Web comme Twitter. Pour le profil, vous souhaitez avoir une mise en page comme celle-ci :

How HTML, CSS, and JavaScript Work

Tout d’abord, nous utilisons HTML pour définir les éléments constitutifs de cette mise en page. Quels sont ces éléments de base ici ?

  1. Une image.
  2. Un texte indiquant le pseudo Twitter de l'utilisateur (par exemple, @KarlgustaAnnoh).
  3. Un autre bloc de texte contenant le message (Enseigner le codage à travers des histoires...).
  4. Boutons/icônes pour modifier le profil, l'emplacement, le lien et la date.
  5. Nombre de followers.

Nous utilisons HTML pour ajouter ces éléments de base à notre page Web.

Ensuite, nous utilisons CSS pour lui donner un attrait visuel. Par exemple, avec CSS, on peut mettre le texte en gras (comme le nom), on peut arrondir notre image. Nous pouvons également changer la couleur des icônes de lieu, de lien et de date, et définir leur apparence lorsque nous les survolons.

Donc, CSS concerne uniquement les effets visuels. Avec CSS, nous pouvons également créer de belles animations.

De nos jours, la plupart des pages Web sont interactives. Ils répondent à nos actions comme les clics et les défilements. C'est là qu'intervient JavaScript. Avec JavaScript, nous pouvons ajouter des fonctionnalités ou un comportement à nos pages Web. Par exemple, on peut cliquer sur un bouton pour suivre une personne.

Ainsi, JavaScript est un langage de programmation, alors que HTML (Markup Language) et CSS (Styling Language) ne le sont techniquement pas. Cela signifie que nous ne pouvons pas les utiliser pour dire aux ordinateurs quoi faire. Nous les utilisons pour définir les éléments constitutifs de nos pages Web et les styliser.

Chaque page Web que vous avez vue sur Internet est construite avec ces trois langues. Ainsi, mieux vous les apprendrez et les comprendrez ainsi que leurs fonctionnalités, mieux vous serez en développement frontend.

À la prochaine !

P.S. C'est ma nouvelle série. Si vous débutez dans le codage et que vous souhaitez de l'aide pour apprendre à coder, consultez The 2 Hour Web Developer.

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!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal