Comment faire une boîte autour de votre texte

Mettez en surbrillance texte important sur votre page Web en utilisant des boîtes.

Chaque fois que vous visitez un site Web qui a des boîtes autour du texte, les développeurs du site probablement créé cet effet l`aide de feuilles de style en cascade (CSS). CSS permet aux développeurs d`appliquer un style visuel des éléments sur une page Web. De nombreux éléments HTML ont des boîtes autour d`eux. Les boîtes peuvent ne pas être visible, mais ils existent. Les développeurs non seulement les rendre visibles au besoin, mais ils utilisent aussi CSS pour définir la couleur, le style et la largeur des boîtes. Pour ajouter une zone autour du texte sur une page Web, mettez le texte dans une page HTML

élément et l`utilisation de CSS pour dénommer.

  • Créer un nouveau fichier HTML et ajouter ce code à la section:


    La boîte autour de ce texte est en pointillés et rouge





    La boîte autour de ce texte est plus épais, en pointillés et bleu


    La boîte autour de ce texte est solide, plus épais et jaune

    le

    tag définit une boîte. Si vous ne définissez pas les propriétés d`un
    , la boîte sera invisible. Chacune de ces boîtes référence une classe CSS différente. La section CSS du document HTML contient les caractéristiques d`affichage pour chaque
    . Par exemple, la première zone de texte fait référence à une classe CSS nommée "dottedRed." Cette classe définit la couleur de la bordure au rouge et le style de bordure à pointillé. La boîte autour du texte dans cette div apparaît en pointillé et rouge. Les deux autres
    référence des balises différentes classes qui définissent des caractéristiques visuelles différentes pour leurs boîtes.

  • Ajouter ces définitions de style de feuille à la section:

    Voir Ressources pour afficher les valeurs des propriétés des frontières possibles qu`un élément de bloc HTML peut avoir. Dans la définition de la classe "dottedRed", les propriétés de bordure sont fixés aux valeurs indiquées. Contrôler le remplissage entre le texte et le bord de la boîte en ajustant la valeur de "padding". Dans ces exemples, le rembourrage est fixé à cinq pixels. Cela signifie que le texte dans chaque case sera de cinq pixels à une distance de chaque côté de la boîte.

  • Enregistrez le fichier et l`afficher dans votre navigateur. La boîte autour de chaque bloc de texte affiche les propriétés visuelles définies dans la feuille de style en cascade.

Conseils Avertissements

  • Texte dans une boîte se terminera en fonction de la valeur «largeur» que vous définissez dans le CSS. Augmentez la valeur de largeur si vous voulez plus de lignes de texte. Utilisez votre imagination en dénommant les bordures de buis autour de votre texte. Mélanger et combiner les couleurs différentes, frontière-styles, frontière largeurs et d`autres propriétés pour adapter l`apparence de vos boîtes.
Technologie / Programmation web / Html

AUTRES

» » » » Comment faire une boîte autour de votre texte