, sera marqué différemment. Cependant, il s'est avéré que dans les navigateurs populaires, le résultat de l'utilisation de ces balises est équivalent.
Je demande aux sénateurs de garder le discours non écrit,
mais avec vos propres mots, pour que les bêtises soient visibles par tout le monde !

Pierre Ier. Actuellement, est la principale manière de présenter l’information. La grande majorité des sites sur Internet sont constitués de contenu textuel. Cela signifie que si vous avez la compétence, vous pouvez, au minimum, lire et, au maximum, écrire (il y a une part de vérité dans chaque blague).

Disons que vous avez tapé du texte dans un éditeur, que vous l'avez formaté (quelques mots ont été mis en surbrillance) audacieux ou italique), ou j'en ai fait autre chose. Ensuite, j'ai copié et collé le texte dans mon code html. Vous ouvrez une page HTML dans , et tout votre formatage a disparu quelque part. Cela se produit parce que l'éditeur de texte utilise ses propres caractères spéciaux pour formater le texte (essentiellement les mêmes balises, utilisées uniquement dans les éditeurs de texte), que vous ne voyez pas par défaut.

Dans la fenêtre de l'éditeur, vous ne voyez que du texte. Mais en fait, il existe aussi des caractères de contrôle spéciaux, avec lesquels l'éditeur « comprend » comment afficher tel ou tel morceau de texte. Autrement dit, je le répète, c'est la même chose, uniquement « adapté » pour être utilisé dans les éditeurs de texte.

Mais malgré cela, il existe un moyen de transférer du texte depuis l'éditeur et de le coller dans le code HTML sous sa forme originale. Et puisque nous en parlons, commençons à étudier le formatage du texte à partir de cette balise. Alors commençons.

§ 2. Les balises de formatage elles-mêmes

Du texte préformaté peut être inséré dans une page HTML à l'aide des balises et. Le navigateur affichera le texte compris entre ces balises tel qu'il apparaîtrait dans l'éditeur de texte. Pour être honnête, je n’ai jamais utilisé cette balise dans la pratique, je ne peux donc rien en dire d’autre.

Les balises les plus populaires pour le formatage du texte sont :

• - utilisé pour surligner du texte audacieux.


• - utilisé pour recevoir italique texte. Il est recommandé d'utiliser la balise à la place de cette balise.


• - permettra souligner texte. L'essentiel ici est que l'utilisateur ne confonde pas le texte souligné avec un lien.


• - fait barrer le texte.


• - conçu pour mettre en évidence le texte en indice (indice). Cette balise peut être utile, par exemple, pour écrire des formules chimiques. Voici le code

  H2O

  Cela nous donne cette formule



• - nécessaire pour mettre en évidence le texte en exposant (exposant). Par exemple, pour écrire une exponentiation : on écrit

  (a+b)2,

  Nous obtenons

  (a+b)2.

Toutes ces balises peuvent être utilisées pour formater du texte une à la fois ou plusieurs ensemble. Ceci est réalisé en imbriquant les balises les unes dans les autres. Par exemple, le code html suivant :

H2O est la formule de l'eau.

en regardant

H2O- Ce formule d'eau.

§ 3. Paragraphes

En HTML, les paragraphes sont créés à l'aide du . L'utilisation de cette balise insère une ligne vide et place l'élément de page HTML visible derrière elle sur la ligne suivante. Par exemple, si on écrit :

Cela ressemblera donc à ceci :

Et il n'est pas nécessaire d'utiliser une balise de fermeture, puisque le navigateur considère que le début du paragraphe suivant signifie la fin du précédent, mais il convient d'éviter toute confusion.

§ 4. Alignement du texte

Pour aligner le texte, utilisez l'attribut aligner avec des valeurs possibles centre, gauche, droite Et justifier. En conséquence, il aligne le texte au centre, à gauche, à droite et en même temps sur deux bords à la fois. Par exemple, code html :

align="center">Texte centré

alignera le texte au centre :

Texte central

Et ce code :

à droite">

alignera le texte à droite

Aligner le texte à droite

Si l'attribut aligner n'est pas utilisé, le texte sera aligné à gauche. Cela se produit par défaut. Exemple de code :

alignera le texte à gauche

Par défaut, le texte est aligné à gauche

§ 5. Saut de ligne et barre horizontale

Si vous devez assurer une transition vers une nouvelle ligne sans insérer de ligne vide (cela se produit lorsque vous appuyez sur Entrée dans un éditeur de texte), utilisez la balise
. Par exemple, le code HTML

1. Première ligne.
2. Deuxième ligne.

dans le navigateur, cela ressemblera à ceci :

1. Première ligne.
2. Deuxième ligne.

U
pas de balise de fermeture. Vous avez probablement déjà deviné que pour insérer plusieurs lignes vides, il faut écrire la balise
plusieurs fois de suite.

Vous pouvez également séparer visuellement des parties du texte à l'aide de la balise. Cette balise crée une barre de séparation sur la page (par exemple, comme la barre verte au début de cet article). La balise a les attributs suivants :

• taille- épaisseur de la bande ;


• largeur- largeur de bande ;


• aligner- l'alignement ;


• couleur- couleur des rayures ;


• noshade- un attribut qui n'a aucune valeur. Si spécifié, une barre noire unie sans ombre est créée.

Par exemple, code html :

align="center" size="5" width="50%" color="#3399ff">

dans le navigateur, cela ressemblera à

La largeur et l'épaisseur peuvent être spécifiées à la fois en pixels (la valeur sera alors constante) et en pourcentage (la valeur changera alors en fonction de la résolution de l'écran).

§ 6. Rubriques

Pour définir les noms des sections et sous-sections en HTML, utilisez balises de titre. Il existe six niveaux de titres et ils sont désignés comme suit :

• - titre de premier niveau


• - titre de deuxième niveau


• - titre de troisième niveau


• - titre de quatrième niveau


• - titre de cinquième niveau


• - titre de sixième niveau

Les titres sont en gras et séparés du reste du texte par une ligne blanche. Le titre le plus grand est (le titre de cette leçon est mis en évidence par celui-ci) et le plus petit est . Les balises de titre ont les attributs suivants :

• aligner- alignement du texte du titre sur la page (les valeurs sont les mêmes que pour l'alignement du texte normal) ;


• titre- une info-bulle qui apparaît lorsque vous passez la souris sur le titre.

Par exemple, le code HTML :

align="center" title="Tooltip. Passez votre souris sur le titre pour le voir.">Заголовок 4 уровня !}

dans le navigateur, cela ressemblera à ceci :

En-tête de niveau 4

§ 7. Travailler avec des polices

Pour formater directement les polices, HTML dispose d'une balise. Cette balise possède les attributs suivants :

• couleur- couleur du texte de la police ;


• affronter- police de caractères ;


• taille- taille du texte de la police. Peut être spécifié sous forme de valeur absolue (1 à 6) ou de valeur relative (+1 à +6 et -1 à -6). Par défaut, la taille du texte est 3. Si vous spécifiez taille="+1"

§ 8. Création de listes en HTML

En HTML, les listes sont créées à l'aide de balises et. Dans le premier cas, des listes ordonnées (numérotées) sont créées, dans le second, des listes non ordonnées (à puces). Chaque élément de la liste est mis en évidence par une balise. Le navigateur affiche les éléments de la liste sur une nouvelle ligne sous forme de colonne en retrait avec des puces. Le type de marqueur est déterminé par l'attribut taper.

Dans une liste numérotée, les marqueurs (valeurs d'attribut de type) sont les suivants :

• 1 - numérotation en chiffres arabes (par défaut) ;


• UN- en lettres majuscules latines par ordre alphabétique ;


• un- des petites lettres latines ;


• je- de grands chiffres romains ;


• je- des petits chiffres romains.

Par exemple, le code HTML

Premier élément.
Deuxième élément.
Troisième élément.

Le navigateur l'affichera comme ceci.

Si vous utilisez un traitement de texte, tel que Microsoft Word ou Microsoft Excel, vous devez être familier avec le formatage du texte et savoir comment mettre le texte en gras (gras), en italique (italique), barré ou souligné. Ce ne sont là que quatre des onze options disponibles indiquant comment le texte peut être formaté en HTML et XHTML.

Texte en gras ou en gras

La police grasse ou la police grasse en HTML peut être définie à l'aide de deux balises ... Et ... . Tout ce qui est dans les balises ... Et ... apparaît en HTML sous forme de texte en gras (gras), comme indiqué ci-dessous :

Exemple

En utilisant la balise b, nous faisons caractères gras.

En utilisant la balise forte que nous faisons texte en gras.

On obtient le résultat suivant :

Italique - Texte ou police en italique

Vous pouvez rendre le texte en italique en HTML à l'aide de deux balises ... Et ... . Tout est en italique ... Et ... apparaît en HTML en texte italique (police) comme indiqué ci-dessous :

Exemple

En utilisant la balise i, nous faisons texte ou police en italique.

En utilisant la balise em, nous faisons texte en italique.

On obtient le résultat suivant :

Texte souligné

Vous pouvez souligner du texte en HTML à l'aide d'une balise ... ... apparaît en HTML dans le texte souligné (police) comme indiqué ci-dessous :

Exemple

En utilisant la balise u, nous le faisons texte ou mot souligné.

On obtient le résultat suivant :

Texte barré

Vous pouvez barrer du texte en HTML à l'aide d'une balise ... . Tout ce qui se trouve à l'intérieur de la balise ... apparaît en HTML en texte barré (police) comme indiqué ci-dessous :

Exemple

En utilisant la balise d'avertissement, nous le faisons texte barré.

On obtient le résultat suivant :

Police monospace

Contenu de l'élément ... écrit en HTML dans une police monospace. La plupart des polices ont des largeurs variables car différentes lettres ont des largeurs différentes (par exemple, la lettre « у » est plus large que la lettre « r »). Cependant, dans une police à espacement fixe, chaque lettre a la même largeur.

Exemple

En utilisant la balise tt, nous faisons police monospace.

On obtient le résultat suivant :

Exposant

Contenu des balises ^... apparaît en HTML en exposant. Balise en exposant ^{en HTML a la même taille de police que les caractères qui l'entourent, mais il n'utilise que la moitié de leur hauteur. Cet élément est bien adapté lorsqu'il faut, par exemple, écrire la puissance d'un nombre en HTML.}

Exemple

En utilisant la balise sup, nous créons le dessus ^indice ou puissance d'un nombre, par exemple 2 ³.

On obtient le résultat suivant :

Indice

Contenu des balises _... apparaît en HTML en indice. Balise d'indice _{en HTML a la même taille de police que les caractères qui l'entourent, mais il n'utilise que la moitié de leur hauteur.}

Exemple

En utilisant la balise sub, nous créons le fond _indice.

On obtient le résultat suivant :

Texte collé

Contenu à l'intérieur d'une balise ... apparaît en HTML sous forme de texte collé.

Exemple

je veux gagner de l'argent beaucoup tellement argent.

On obtient le résultat suivant :

Texte supprimé

Contenu à l'intérieur d'une balise ... apparaît en HTML sous forme de texte supprimé.

Exemple

je veux gagner de l'argent beaucoup tellement argent.

On obtient le résultat suivant :

Grand texte

Contenu des balises ... apparaît en HTML sous forme de grand texte, une taille de police plus grande que le reste du texte environnant, comme indiqué ci-dessous :

Exemple

En utilisant le gros tag que nous faisons texte plus.

On obtient le résultat suivant :

Petit texte

Contenu à l'intérieur d'une balise ... apparaît en HTML sous forme de petit texte, d'une taille de police plus petite que le reste du texte environnant, comme indiqué ci-dessous :

Exemple

En utilisant la petite balise que nous faisons le texte est plus petit.

On obtient le résultat suivant :

Regroupement d'éléments et de contenu de page en HTML

Éléments

Et permettre à plusieurs éléments d'être regroupés en HTML pour créer des sections ou sous-sections d'une page.

Par exemple, vous pouvez mettre tous les liens d'une page dans une balise

pour indiquer que tous les éléments de cette balise

reportez-vous au menu. Ensuite, vous pouvez styliser la balise

afin que les éléments soient rendus à l'aide d'un ensemble spécial de règles de style (CSS).

Exemple avec balise

ACCUEIL / À PROPOS DE NOUS / CONTACTS

Titre de l'article

Contenu des pages...

On obtient le résultat suivant :

Par contre, l'élément peut être utilisé pour regrouper uniquement des éléments en ligne. Ainsi, si vous souhaitez combiner une partie d'une phrase ou d'un paragraphe (paragraphe), vous pouvez utiliser l'élément comme suit:

Exemple avec balise

Regrouper des éléments à l'aide balise d'étendue.

On obtient le résultat suivant :

Ces balises sont généralement utilisées avec CSS pour vous permettre de styliser une section d'une page.

Bonjour, chers lecteurs du blog ! Cet article parlera de balises de formatage du texte. Les principaux exemples incluent la mise en gras ou en italique du texte. Nous examinerons également l’impact de certaines balises sur l’optimisation interne du site et les règles de rédaction de celles-ci. Vous pouvez lire à ce sujet dans l’article donné. À propos, vous pouvez trouver des éléments de conception de texte similaires dans de nombreux éditeurs de texte, par exemple dans Word.

Les balises sont divisées en 2 types : en bloc et en ligne. Lorsque vous utilisez le premier, vous pouvez modifier le contenu d'une partie du texte (lignes, fragments individuels ou mots), tandis que les seconds le sont. Les balises de formatage que nous examinerons dans cet article sont principalement en minuscules.

Règles et ordre d'écriture des balises

Vous savez déjà ce que sont les balises d'ouverture et de fermeture. Sinon, lisez l'article donné au tout début de ce document. En bref, il existe deux types de balises : simples (par exemple, nouvelle ligne
) et conteneur (par paires). Ainsi, toutes les balises de formatage du texte sont jumelé. Cela signifie que tout élément a une balise d'ouverture et de fermeture, et la surbrillance doit être placée entre elles. Par exemple, la sélection correcte d'une phrase ressemblerait à ceci : Fragment sélectionné

Lorsque le navigateur traite ce fragment, vous verrez le texte suivant : Fragment sélectionné. D'ailleurs, toutes les balises ne sont pas affichées dans le flux RSS ().

L’essentiel lors de l’écriture de balises est de penser à les fermer. Sinon, tout le texte de la page sera surligné en gras (dans l'exemple avec la balise ). Mais il existe des cas où vous devez mettre en évidence un certain fragment à la fois en gras et en italique. Mais aucune balise n’effectue cette action. Il n'y a qu'un seul moyen de sortir de cette situation : utiliser deux balises en même temps. Peu importe dans quel ordre vous les utilisez. Par conséquent, écrire du texte avec des balises comme celle-ci :

Fragment sélectionné

ou comme ça :

Fragment sélectionné

Vous recevrez toujours Fragment sélectionné italique et gras à la fois. Cependant, il est préférable d’utiliser la première option, car au départ c’était la seule et la bonne. N'oubliez pas non plus que chaque navigateur peut traiter les balises différemment (), en fonction des paramètres. Passons maintenant aux balises de formatage elles-mêmes.

Texte en gras et en italique - balises , , Et

Les balises de formatage de texte les plus populaires - en les mettant en évidence audacieux Et italique. Ils sont généralement utilisés pour donner de l'importance à un fragment. Le premier cas sert à mettre en évidence un fragment contenant des informations utiles ou des mots-clés. L'italique a le même objectif que le texte en gras, mais l'information est moins importante car l'italique est moins visible à l'arrière-plan du corps du texte que le texte en gras.

Considérons d'abord mettre le texte en gras. Il y a deux balises utilisées pour cette action - Et . Il n'y a aucune différence d'apparence. Cependant, étant donné que chaque navigateur peut interpréter chaque élément différemment, vous pourrez peut-être constater des différences. Voici à quoi ressemble le texte dans les balises Et sous une forme déjà traitée par le navigateur :

Texte dans les balises fortes

Texte dans les balises b

Et voici à quoi ressemblent ces deux lignes dans le code source de la page :

Texte dans les balises fortes Texte dans les balises b

On peut observer la même situation dans le cas de balises italiques Et . Essayez de trouver les différences entre les deux exemples :

Texte dans les balises em

Texte dans les balises I

Et voici le code source :

Texte dans les balises em Texte dans les balises I

Ainsi, les balises gras et italiques considérées ne sont en réalité pas différentes, mais alors pourquoi avons-nous besoin, par exemple, de la balise s'il y a ? Après tout, ce dernier ne contient qu’un seul caractère (sans compter les parenthèses) et est donc plus facile à écrire. Et le fait est que les balises Et influence . Si vous entourez les mots-clés de ces balises, cela aura un effet bénéfique sur la promotion du site Web. L'essentiel est de ne pas en faire trop - le texte doit contenir au maximum 5 % de texte en gras dans la balise. , et la même quantité d'italique dans la balise .

Si vous souhaitez simplement mettre en évidence un point du texte, utilisez la balise ou . En général, je pense que les moteurs de recherche considèrent également le texte de ces balises comme plus important, mais optimisation interne ils ont encore moins d'influence que Et .

Balises pour surligner du texte avec une ligne - , Et

Examinons maintenant quelques balises qui utilisent un tiret dans la conception du texte. L'éditeur de texte le plus célèbre que vous connaissez est étiqueter ou souligner. Cette balise n'a pas d'impact sur le classement (pour autant que je sache), mais mettre en évidence du texte et attirer l'attention dessus sera utile. J'ai donné un exemple d'utilisation de cette balise juste au dessus.

Deux autres balises similaires dans leur objectif - Et . Les deux remplissent la fonction de supprimer du texte. Vous pouvez utiliser cette balise dans n'importe quelle situation : si vous mettez à jour un document (ou plutôt une partie de celui-ci), vous pouvez rayer l'ancien et en ajouter un nouveau ; si vous allez écrire quelque chose qui s'écarte du sujet du matériel ; quelque chose qui ne correspond pas aux normes morales et éthiques.

Les différences entre ces deux balises résident uniquement dans leur en écrivant, de sorte qu'il est préférable d'utiliser le premier, car premièrement, c'est plus pratique à écrire, et deuxièmement, votre page contiendra moins de code HTML, et les moteurs de recherche adorent cela.

Étiqueter et attributs - paramètres de police du texte

Considérons maintenant une balise qui n'est pas utilisée sans attributs. En l'utilisant, vous pouvez définir les paramètres d'un morceau de texte spécifique. De manière générale, il est désormais préférable d'utiliser des (feuilles de style en cascade), car... en les utilisant, vous pouvez réduire considérablement tout le code HTML de la page. Alors, regardons cette même balise . Tout existe pour lui trois attributs :

• affronter- la police elle-même. Par exemple, Arial, Courier ou Verdana. Vous pouvez en citer plusieurs, car tous les utilisateurs ne disposent pas d'un ensemble complet de polices, et en en écrivant plusieurs dans l'attribut face, le navigateur pourra choisir laquelle utiliser, ou plutôt laquelle est présente dans le système ;
• taille— un attribut indiquant la taille du texte. Peut être exprimé aussi bien en unités conventionnelles qu'en pixels ;
• couleur— couleur du texte. Cet attribut peut être utilisé aussi bien dans les codes de couleurs HTML que dans ceux de mots. Les premiers ont la forme #FFFFFF (où F est n'importe quel chiffre ou lettre de A à F), et les seconds sont écrits avec des mots simples (par exemple, rouge).

Voici à quoi ressemble le texte dans la balise en utilisant chaque attribut :

Ce texte fait 6px

Ce texte est rouge

Ce texte est en police Arial

Ce texte est rouge et taille 5px

Et voici ce que vous verrez après avoir traité le code écrit :

Bloquer les éléments de conception de texte - titres

-

, paragraphe

Enfin, nous examinerons les éléments de bloc, qui sont utilisés dans presque tous les documents. Ce sont des balises de titre et de paragraphe. Considérons le premier. Il existe 6 types de titres et chacun a sa propre balise. Chaque type n'a que son propre numéro de série et est enregistré à l'aide de balises

,

,...,

. Voici à quoi ressemblent tous les en-têtes une fois traités :

Le numéro après le titre du mot correspond au numéro dans la balise . Les titres ont un impact énorme sur l'optimisation de la page, alors enveloppez-les dans des balises mots-clés. Cette affaire présente de nombreuses caractéristiques, dont je parlerai dans les articles suivants.

Parlons maintenant de la balise de surbrillance du paragraphe

La fonction de cette balise est de séparer le texte entre un autre texte identique et une ligne vide. Si vous regardez le code source d'un document, vous pouvez voir ce qui suit :

Les rectangles verts contiennent un paragraphe, les rectangles rouges en contiennent un autre. Et voici à quoi ressemble ce code après traitement par le navigateur (la flèche pointe vers une ligne vide) :

En conséquence, nous obtenons une séparation assez notable d'un paragraphe d'un autre, ce qui est bénéfique - la lecture devient plus pratique.

C'est la fin de l'article sur balises de formatage de document. Il y en a beaucoup plus que ce que j'ai décrit dans ce document. C'est juste qu'il y a beaucoup à dire sur certains d'entre eux, c'est pourquoi des articles séparés avec une revue complète leur seront consacrés !

Le texte des documents HTML est formaté à l'aide de balises appropriées. Le tableau montre les balises utilisées pour formater les caractères et l'effet qu'elles créent.

Balises pour formater le texte

Balise HTML	Effet	Exemple
Texte	Écrire un texte en gras	Texte
Texte	Texte en gras	Texte
Texte	Écrire un texte en italique	Texte
Texte	Mettre en évidence les parties importantes du texte (le texte apparaît en italique)	Texte
Texte	Texte souligné	Texte
Texte	Texte barré	Texte
Texte	Exposant	100 m2
Texte	Indice	H2SO4

De plus, vous pouvez définir divers paramètres de police. En particulier, en utilisant la balise ... définissez la police, la taille et la couleur de la police. Cette balise est unique et affecte tout le texte placé à l'intérieur du conteneur.

• VISAGE="valeur"- police de caractères. Si la police spécifiée ne se trouve pas sur l'ordinateur de l'utilisateur, le texte sera formaté en utilisant la police par défaut. Dans l'attribut AFFRONTER parfois plusieurs polices sont écrites séparées par des virgules, puis le navigateur sélectionne les polices dans la liste : si la première manque, il utilise la seconde, etc. La valeur de l'attribut doit être donnée entre guillemets.
  Exemple:
  

  Tahoma , Arial Noir

  
  Résultat:
  Tahoma Arial Noir
• TAILLE="valeur"- taille de police (entier de 1 à 7). Attribut TAILLE avec un signe moins (ou plus) signifie que la taille de la police sera réduite (ou augmentée) du montant correspondant par rapport à celle par défaut. Une valeur non signée spécifie la taille de police absolue.
  Exemple:
  

  1 ... 7

  
  Résultat:
  1 , 2 , 3 , 4 , 5 , 6 , 7
• COULEUR="valeur"- la couleur de la police. Comme signification de couleur, vous pouvez utiliser les noms de couleurs en anglais, tels que rouge, vert, bleu etc., ou des valeurs hexadécimales (écrites en notation hexadécimale) commençant par le caractère # et spécifiez séquentiellement les couleurs rouge, vert et bleu, qui doivent être mélangées pour obtenir la teinte souhaitée. Cette dernière est préférable, car dans le premier cas, le choix de la teinte dépend des paramètres du navigateur spécifique du client ! Exemple:
  

  Texte , Texte

  
  Résultat:
  Texte, Texte

Pour concevoir un site Web, ils utilisent généralement un ensemble de couleurs appelé . Il se compose de 216 éléments. La particularité des couleurs « sûres » est qu'elles ne changent pas lorsqu'elles sont affichées par différents navigateurs ou sur différents moniteurs, c'est-à-dire que cette palette garantit une représentation précise de ce que le concepteur Web a prévu sur différents moniteurs. Si l'une des trois composantes d'une valeur hexadécimale diffère de 00 , 33 , 66 , 99 , SS ou FR, alors la couleur n'est pas sûre. Valeurs d'attribut TAILLE Et COULEUR Vous pouvez l'écrire sans guillemets, mais il vaut mieux tout faire selon les règles.

Il existe d'autres balises qui peuvent être utilisées pour modifier les paramètres du texte :

• Texte- augmenter la taille de la police. La taille des caractères du texte augmente d'une unité par rapport au niveau actuel.
• Texte- réduire la taille de la police. La taille des symboles est réduite de un par rapport au niveau actuel.
• Texte- créer du texte barré. Le texte sera barré d'une ligne horizontale.
• texte- affiche du texte ou une image sous forme de « ligne rampante » avec du texte situé entre eux.
  
  
  Des questions ?

  Nom

  E-mail *

  Message *

  Envoyer
  Signaler une faute de frappe

  Texte qui sera envoyé à nos rédacteurs :

  Votre commentaire (facultatif) :

  Envoyer Annuler