Hintergrund und Rahmen für HTML-Tag erstellen
In diesem Artikel zeige ich Ihnen, wie Sie einen Hintergrund für HTML-Tags erstellen, wodurch Sie wissen, wie Sie einige CSS-Eigenschaften für den Hintergrund verwenden.
Um eine Hintergrundfarbe für ein beliebiges HTML-Tag zu erstellen, verwenden wir die Eigenschaft background. Diesen Artikel habe ich in der CSS-Lernreihe vorgestellt, aber zu Ihrer Bequemlichkeit werde ich heute eine völlig neue Lektion erstellen. Sie können den Artikel lesen, den ich oben verlinkt habe, um mehr zu erfahren.
1. Erstellen Sie eine Hintergrundfarbe für HTML-Tags
Angenommen, ich habe ein div -Tag und möchte einen Hintergrund und einen Rahmen dafür erstellen. Verwenden Sie einfach die Hintergrund- und Rahmeneigenschaften .
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <style type="text/css"> div{ background: red; height: 200px; } </style> </head> <body> <div> Nội dung bên trong </div> </body> </html>Fügen Sie einen Rahmen hinzu.
div{ background: red; height: 200px; border: solid 3px blue; }Wie Sie sehen können, hat der Hintergrund für dieses div-Tag eine Länge von 100 %. Der Grund ist, dass das div-Tag als Block dargestellt wird, also eine Breite von 100 % hat. Wenn wir es jetzt durch ein span-Tag ersetzen, wird es ganz anders aussehen.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <style type="text/css"> span{ background: red; border: solid 3px blue; } </style> </head> <body> <span>Thẻ span</span> </body> </html>2. Hintergrund- und Randfarben verstehen
In Bezug auf Farben können Sie nach den folgenden Regeln verwenden:
- Verwenden Sie englische Namen wie schwarz, weiß, rot, blau …
- Verwenden Sie das RGB-Format wie:
- rgb(255,0,0) = rot
- rgb(0,255,0) = grün
- rgb(0,0,255) = blau
- rgb(0,0,0) = schwarz
- rgb(255.255.255) = weiß
- Verwenden Sie das Hex-Format wie:
- #ff0000 = rot
- #00ff00 = grün
- #0000ff = blau
- #000000 = schwarz
- #ffffff = weiß
- Und ein paar andere Formate wie RGBA und HSL
Wir verwenden normalerweise das Hex-Format, da dies der Standard-Farbcode in Photoshop ist.
Zum Beispiel : Stellen Sie den Hintergrund auf Rot ein, Sie können eine der folgenden Möglichkeiten schreiben.
background: red; background: #ff0000; background: rgb(255,0,0); Bài viết liên quan:
Dịch vụ thiết kế Wesbite
