Galerie de cartes mentales Balises HTML de base
Une nouvelle introduction aux balises HTML de base ! Le contenu comprend la composition, la structure de base, les outils d'édition de pages Web, les éléments multimédias HTML, les blocs et les lignes des pages HTML, les informations de base des pages Web, etc. Les amis intéressés peuvent le télécharger et le collecter.
Modifié à 2023-02-26 01:27:03This is a mind map about bacteria, and its main contents include: overview, morphology, types, structure, reproduction, distribution, application, and expansion. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about plant asexual reproduction, and its main contents include: concept, spore reproduction, vegetative reproduction, tissue culture, and buds. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about the reproductive development of animals, and its main contents include: insects, frogs, birds, sexual reproduction, and asexual reproduction. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about bacteria, and its main contents include: overview, morphology, types, structure, reproduction, distribution, application, and expansion. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about plant asexual reproduction, and its main contents include: concept, spore reproduction, vegetative reproduction, tissue culture, and buds. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about the reproductive development of animals, and its main contents include: insects, frogs, birds, sexual reproduction, and asexual reproduction. The summary is comprehensive and meticulous, suitable as review materials.
Balises HTML de base
La composition d'une page Web
Partie HTML (<html>contenu</html>)
Partie JS (<script>Effets spéciaux</script>)
Partie CSS (<style>style</style>)
structure basique
<! DOCTYPE html> Déclaration
<title>Titre de la page Web</title>
page web html
<tête>partie de la tête
<corps>Partie principale
<body>Contenu de la page Web, qui peut être du texte, des images, etc.</body>
Outils d'édition de pages Web
carnet de notes
Tisseur de rêves
Bloc-notes++
Constructeur
VScodr
Informations de base de la page Web
Solutions aux caractères tronqués
Ajouter la balise <meta> à la section head
<méta charset="gb2312">
Chinois simplifié : gb2312
Chinois traditionnel : big5
Page Web en anglais pur : iso-8859-1
Conforme aux normes internationales : UTF-8
Couleur d’arrière-plan de la page ou image d’arrière-plan
bgcolor="#FFCCFF""
Couleur d’arrière-plan de la page Web
background="back_image.GIF""
Image d'arrière-plan d'une page Web
Sémanticisation des balises de base sur les pages Web
titre
<h1>
paragraphe
<p>...</p>
image
<img>
nouvelle ligne
<br>
ligne horizontale
<hr>
<hr size="5">Valeur d'épaisseur de la ligne
couleur de la ligne color="rouge"
width="300"/>largeur de ligne
balise de titre
<h1>Titre de niveau 1</h1> <h2>Titre de niveau 2</h2> <h3>Titre de niveau 3</h3> <h4>Titre de quatrième niveau</h4 <h5>En-têtes à cinq niveaux</h5> <h6>En-têtes à six niveaux</h6>
<h1> est le plus grand, suivi de <h2> et ainsi de suite...
Il est recommandé d'inclure des mots-clés lors de l'utilisation des balises <h1> et <h2>, et il est recommandé de n'apparaître qu'une seule fois. Les balises <h3>, <h4> et <h5> ont peu d'effet SEO et il est recommandé de ne pas les utiliser sans discernement.
balise d'image
*.jpg
*.gif
*.png
*.bmp
Grammaire de base des images
<img src="balise d'image"
emplacement de l'image
largeur="300"
Largeur de l'image
hauteur="150"
hauteur de l'image
alt="Ouverture du concert de célébrités">
Texte indicatif ajouté à l'image, souris Déplacez l'image pour afficher un texte informatif
balise de liste
L'attribut de type liste non ordonné définit des puces
Puces : disque (par défaut), carré et cercle
Implémenté avec la balise <ul>
Utilisez la balise <li> pour représenter les éléments de la liste
L'attribut de type liste ordonnée définit l'ordre des éléments
Ordre du projet : 1 (par défaut), A, a, I, i
Implémenté avec la balise <ol>
Utilisez la balise <li> pour représenter les éléments de la liste
Définir la table des classes - pas de puces ni d'ordre d'affichage
Pas de puces et ordre d'affichage
Implémenté avec <dl tag>
Définir les éléments de la liste avec la balise <dt>
Définir le contenu avec la balise <dd>
Étiquettes de texte préformatées
Balise :<pre>…</pre>
Exemple :<pre>…… </pre>
lien hypertexte
Balise <a>
<a href="chemin"
chemin du lien
target="position cible de la fenêtre">"
Description : Dans quelle fenêtre le lien s'ouvre
Lier du texte ou une image</a>
Remarque : Accédez à la page correspondante après le mode autonome
Valeurs communes : _self, _blank
Lien vers d'autres pages
Chemin relatif : spécifie l'emplacement du fichier par rapport au fichier actuel
Exemple : Pour créer un lien vers une page du même répertoire (C:\HTML), écrivez <a href="doc1.html>
Chemin absolu : spécifiez le chemin complet du répertoire racine vers le fichier
Exemple : Pour créer un lien vers une page du même répertoire (C:\HTML), écrivez <a href="c:\html\doc2.html>
Lien vers cette page
Balises d'ancrage : utilisées pour permettre aux utilisateurs de "sauter" vers une certaine partie du document.
Définir la balise d'ancrage :<a name="helpme">De nouveaux arrivants sur la route pour guider les hommes</a> Lien vers l'emplacement de la balise d'ancrage : <a href="#helpme">[Nouveau sur la route]</a>
Remarque : Si la page n'est pas assez longue, le lien d'ancrage ne sautera pas. À ce stade, ajoutez simplement du contenu supplémentaire à la page pour allonger la page.
Blocs et lignes dans les pages HTML
étiquettes au niveau de la ligne
Caractéristiques : peut être conservé sur la même ligne que d'autres éléments, ne peut pas s'enrouler automatiquement, ne peut pas définir la largeur et la hauteur.
Balises courantes au niveau de la ligne : a, span, strong, u (soulignement), em (accentuation), i (italique), sub (indice), sup (exposant)
balises au niveau du bloc
Caractéristiques : ne peut pas être conservé sur la même ligne que d'autres éléments (occupe une ligne), peut automatiquement être renvoyé et peut définir la largeur et la hauteur.
Balises courantes au niveau des lignes : div, p, h1-h6, ul, li, dl (liste de définitions, similaire à ul...li), dt (définit les éléments dans la liste de définition), dd (définit le contenu de l'élément, correspondant à dt)
Balises de niveau bloc couramment utilisées dans la mise en page
Balise de section <div>
Les balises <div> peuvent être intégrées dans des balises telles que <p> et utilisées comme éléments de bloc ordinaires.
Tableau :<tableau> Ligne : <tr>…</tr> Colonne (cellule) :<td>…</td>
Formulaire :<de> … </de>
Balises en ligne au niveau du bloc
Caractéristiques : peut être maintenu sur une seule ligne avec d'autres éléments et peut également définir la largeur et la hauteur.
Balises communes : zone de texte, entrée, img, bouton
Éléments multimédia HTML
Élément vidéo :<video>…</video>
Exemple :<video src="chemin vidéo"
Description : Spécifiez le chemin du fichier vidéo à lire
contrôles></vidéo>
Description : Fournit des commandes pour la lecture, la pause et le volume
Attributs courants de la balise vidéo
1.autoplay apparaît et la vidéo sera lue immédiatement après qu'elle soit prête.
2. Lorsque les commandes apparaissent, les commandes sont affichées à l'utilisateur, telles que le bouton de lecture.
3.loop apparaît, puis recommencez la lecture une fois la lecture du fichier multimédia terminée.
4.muted apparaît, le son de la vidéo est coupé.
5.src URL de la vidéo à lire
Éléments audio :<audio>…</audio>
<audio src="élément audio"
Description : Spécifiez le chemin du fichier audio à lire
commandes></audio>
Description : Fournit des commandes pour la lecture, la pause et le volume
Attributs de lecture automatique : lecture automatique
<lecture automatique de la vidéo> … … </vidéo>
Attributs communs de la balise source
1.src spécifie l'URL du fichier multimédia 2.type spécifie le type de média de la ressource
Explication : 1. Vous pouvez écrire plusieurs balises source et spécifier le type, qui est compatible avec la prise en charge de différents décodages de navigateur. Mais src ne peut en écrire qu'un seul 2. Les valeurs d'attribut de l'attribut type de la balise source incluent video/ogg, video/mp4, video/webm