4.18 Introduction au HTML : structure de base, balises et attributs
HTML, qui signifie Hyper Text Markup Language, est le langage de balisage standard pour la création de pages Web et d'applications. Combiné avec des technologies telles que CSS (Cascading Style Sheets) et JavaScript, HTML forme la triade essentielle d'outils pour le Web.
Structure de base du HTML
Un document HTML de base a une structure très simple. Cela commence par déclarer le type de document, qui pour HTML5 est simplement <!DOCTYPE html>. Vient ensuite l'élément <html> qui enveloppe tout le contenu de la page. À l'intérieur de cela, nous avons deux éléments principaux : <head> et <body>.
L'élément <head> contient des métadonnées sur le document, telles que son titre (qui apparaît dans la barre de titre ou dans l'onglet du navigateur), des liens vers des feuilles de style CSS, des scripts JavaScript et diverses autres informations. qui n'est pas présenté à l'utilisateur.
L'élément <body> est l'endroit où réside tout le contenu que l'utilisateur voit et avec lequel il interagit. Cela inclut le texte, les images, les vidéos, les formulaires, les boutons et tous les autres éléments interactifs de la page.
Balises et attributs HTML
Les balises HTML sont les éléments constitutifs de toute page Web. Ils définissent et décrivent le contenu. Chaque balise commence par un crochet angulaire (<) et se termine par un crochet angulaire (>). La plupart des balises HTML ont une balise d'ouverture et une balise de fermeture, avec du contenu entre les deux.
Par exemple, <p>Ceci est un paragraphe.</p>. Ici, <p> est la balise d'ouverture, </p> est la balise de fermeture, et tout ce qui se trouve entre les deux est le contenu de la balise. p>
Les attributs HTML fournissent des informations supplémentaires sur les éléments. Ils se présentent sous forme de paires nom/valeur et sont toujours inclus dans la balise d'ouverture. Par exemple, dans la balise d'image <img src="imagem.jpg" alt="Une image">, src et alt ce sont des attributs.
Propriétés et valeurs CSS
CSS, ou Cascading Style Sheets, est un langage de feuille de style utilisé pour décrire l'apparence d'un document écrit en HTML. Il vous permet de contrôler des éléments tels que la couleur du texte, la taille de la police, l'espacement entre les paragraphes, la taille et la disposition des colonnes, les types d'images ou les couleurs d'arrière-plan à utiliser, etc.
Propriétés CSS
Les propriétés CSS sont les aspects du HTML que vous pouvez modifier ou manipuler. Par exemple, vous pouvez modifier la couleur, la marge, le remplissage, la hauteur, la largeur, la bordure, la taille de la police, la famille de polices, la hauteur de ligne, l'alignement du texte, la position, le style de police, la liste, le tableau de mise en page et bien plus encore.
Valeurs CSS
Les valeurs sont ce que vous définissez ou utilisez pour modifier les propriétés CSS. Par exemple, si la propriété est « couleur », alors les valeurs possibles pourraient être « rouge », « vert », « rgb(255,0,0) », « #FF0000 », etc. Chaque propriété possède son propre ensemble de valeurs possibles, dont certaines sont prédéfinies, tandis que d'autres peuvent être définies par l'utilisateur.
Par exemple, la propriété 'font-size' contrôle la taille du texte. Si vous souhaitez que votre texte soit affiché dans une taille de 16 pixels, vous utiliserez la propriété et la valeur comme ceci : font-size : 16px;.
En bref, HTML et CSS sont des outils fondamentaux pour tout développeur Web. HTML fournit la structure et le contenu de la page, tandis que CSS vous permet de contrôler exactement l'apparence de cette page. Avec une bonne compréhension de ces deux langages, vous pouvez créer des pages Web dynamiques et attractives.