Comment écrire la couleur HR de la ligne horizontale en HTML-Questions et réponses frontales-php.cn

Comment écrire la couleur HR de la ligne horizontale en HTML

青灯夜游

Libérer： 2023-02-17 17:11:28

original

6594 Les gens l'ont consulté

En HTML, vous pouvez utiliser l'attribut border-color pour définir la couleur de la ligne horizontale hr. Il vous suffit d'ajouter le style "border-color: color value;" à la balise hr. L'attribut border-color est utilisé pour définir la couleur de bordure d'un élément. Vous pouvez définir quatre couleurs de bordure d'un élément dans une seule déclaration, c'est-à-dire que cet attribut peut avoir une à quatre valeurs.

Comment écrire la couleur HR de la ligne horizontale en HTML

L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3. La balise

définit un changement de sujet (comme un transfert de sujet) dans une page HTML et s'affiche sous forme de ligne horizontale. L'élément

est utilisé pour séparer le contenu d'une page HTML (ou pour définir une variante).

Le style de balise hr par défaut :

Comment écrire la couleur HR de la ligne horizontale en HTML

est juste une ligne noire, ce qui n'est pas beau du tout. Vous pouvez utiliser la propriété border-color de CSS. pour définir la couleur.

<hr style="border-color: red"/>

Copier après la connexion

Rendu :

Comment écrire la couleur HR de la ligne horizontale en HTML

introduction de l'attribut border-color

paramètre de l'attribut border-color Le quatre couleurs de bordure d'un élément. Cette propriété peut avoir une à quatre valeurs.

Valeur de l'attribut :

color Spécifie la couleur d'arrière-plan.
transparent précise que la couleur de la bordure doit être transparente. Il s'agit de la méthode de représentation des couleurs prise en charge par CSS3 par défaut

est représentée par le nom anglais de la couleur. Le nom anglais représente une couleur, mais la représentation est très limitée et difficile à retenir et à interroger.
est représenté par la couleur de hex . Le principe des trois couleurs primaires de couleur et de lumière peut être consulté dans le tableau.
est représenté par rgb (r, g, b). Le principe des trois couleurs primaires de lumière, rouge + vert + bleu.
est représenté par hsl (Teinte, Saturation, Légèreté). Teinte + Saturation + Luminosité.
est représenté par rgba (r, g, b, a). Le principe des trois couleurs primaires lumière, rouge, vert, bleu + transparence. a ∈ [0, 1], 0 représente une transparence totale.
est représenté par hsla (Teinte, Saturation, Luminosité, alpha). Teinte, saturation, luminosité + transparence. alpha ∈ [0, 1], 0 représente une transparence totale.

Exemple :

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html" ;charset="utf-8">
    <title>CSS颜色表示</title>
    <style type="text/css">
      div>div{
        width: 400px;
        height: 40px;
      }
    </style>
  </head>
  <body>
    <script type="text/javascript">
      for (var i = 0; i < 300; i++) {
        document.write("CSS颜色表示");
      }
    </script>
    <div style="position:absolute;top:0px">
      <div style="background-color:gray;">
        background-color:gray
      </div>
      <div style="background-color:#ff4314;">
        background-color:#888
      </div>
      <div style="background-color:#ffff00;">
        background-color:#ffff00
      </div>
      <div style="background-color:rgb(0, 255, 255);">
        background-color:rgb(0, 255, 255)
      </div>
      <div style="background-color:hsl(120, 100%, 50%);">
        background-color:hsl(120, 100%, 50%)
      </div>
      <div style="background-color:rgba(0, 255, 255, 0.5);">
        background-color:rgba(0, 255, 255, 0.5)
      </div>
      <div style="background-color:hsla(120, 100%, 50%, 0.5);">
        background-color:hsla(120, 100%, 50%, 0.5)
      </div>
    </div>
  </body>
</html>

Copier après la connexion

Affichage de la page Web

Comment écrire la couleur HR de la ligne horizontale en HTML