Comment utiliser les balises importantes et difficiles en HTML

La raison pour laquelle j'ai écrit cet article est que j'ai récemment acquis des connaissances front-end, j'ai donc spécialement trié l'utilisation de certaines balises clés pour faciliter les révisions futures.

1. Utilisation d'une balise

Créez un lien hypertexte vers d'autres pages Web, fichiers, emplacements au sein de la même page, adresses e-mail ou toute autre URL. La balise a est une balise très couramment utilisée, mais je pense que bon nombre de ses utilisations ne sont pas bien comprises.

Attribut :

La valeur du href de a :

peut être une URL (écrite de préférence sous la forme //google.com) chemin (/a/b /c, index.html) pseudo-protocole (code js, email, numéro de téléphone portable) L'identifiant est souvent utilisé pour accéder à une certaine partie de la page

une valeur cible :

1 . Nom intégré :

_blank (ouvre une nouvelle page) _top (ouvre la page supérieure, doit être utilisé avec iframe) _parent (ouvre la page au niveau supérieur) _self (la page actuelle est chargée. , cette valeur est la valeur par défaut)

2. Le programmeur le nomme lui-même :

Le nom de la fenêtre (vous pouvez spécifier un nom pour la fenêtre pour l'ouvrir dans la fenêtre spécifiée) Le nom de l'iframe pour ouvrir le téléchargement d'un dans l'iframe spécifié

Il est utilisé comme page de téléchargement et n'est pas couramment utilisé.

2. Utilisation de la balise img

Fonction : Envoyer une requête get et afficher une image

Attributs :

alt : Définit le texte alternatif du image Description height : la hauteur de l'image width : la largeur de l'image src : l'URL de l'image, cet attribut est obligatoire pour l'élément

Écriture réactive :

Par exemple, max-width : 100 %

Élément remplaçable :

est un élément remplaçable. La valeur par défaut de sa propriété d'affichage est inline, mais sa résolution par défaut est déterminée par la largeur et la hauteur d'origine de l'image intégrée, ce qui la fait se comporter comme un bloc en ligne. Vous pouvez définir les propriétés CSS de border/border-radius, padding/margin, width, height, etc. pour . Il n'y a pas de ligne de base, ce qui signifie que lors de l'utilisation de vertical-align: baseline dans un contexte de formatage en ligne, le bas de l'image sera aligné avec la ligne de base du texte du conteneur.

3. L'utilisation de la balise table

représente des données tabulaires, c'est-à-dire des informations représentées par un tableau de données bidimensionnel. C'est relativement simple

(Partage vidéo d'apprentissage : tutoriel vidéo HTML)

Voici un exemple de code

  <caption>Color names and values</caption>
  <tbody>
    <tr>
      <th scope="col">Name</th>
      <th scope="col">HEX</th>
      <th scope="col">HSLa</th>
      <th scope="col">RGBa</th>
    </tr>
    <tr>
      <th scope="row">Teal</th>
      <td><code>#51F6F6</code></td>
      <td><code>hsla(180, 90%, 64%, 1)</code></td>
      <td><code>rgba(81, 246, 246, 1)</code></td>
    </tr>
    <tr>
      <th scope="row">Goldenrod</th>
      <td><code>#F6BC57</code></td>
      <td><code>hsla(38, 90%, 65%, 1)</code></td>
      <td><code>rgba(246, 188, 87, 1)</code></td>
    </tr>
  </tbody>
</table>

Attribut :

align : Cette propriété d'énumération spécifie comment les tableaux contenus dans le document doivent être alignés. Il existe les valeurs suivantes : left, le tableau sera affiché à gauche du document ; center, le tableau sera affiché au centre du document ; right, le tableau sera affiché à droite du document

border : définit la taille de la bordure du tableau. S'il est défini sur 0, cela signifie que l'attribut frame est défini sur vide. S'il est défini sur 1, le tableau a une bordure de 1 px.

**cellpadding :** Cet attribut définit l'espace entre le contenu et la bordure de la cellule du tableau.

**cellspacing : **Cet attribut (en pourcentage ou en pixels) définit la taille de l'espace entre deux cellules

**width : **Cet attribut définit la largeur du tableau. La largeur peut être un pixel ou une valeur en pourcentage, et la valeur en pourcentage de la largeur sera définie comme la largeur du conteneur de table.

border-collapse : réduire les bordures fusionnées

border-spacing : 0 ; l'espacement des bordures est défini sur 0

table { disposition de la table : auto ; border-collapse : effondrement ; espacement des bordures : 0 ; >

4. Autres pensées

Ce ne sont pas difficiles, mais vous devez vous rappeler beaucoup de choses et être plus prudent. ! !

————Une partie des informations textuelles provient de MDN et de Hungry Man Valley

Recommandations associées : Tutoriel HTML

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!