简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Einführung in den CSS-Stil zur Definition horizontaler HR-Linien

高洛峰
Freigeben： 2017-03-27 18:00:45
Original
4360 Leute haben es durchsucht

CSS definiert mehrere Stile von HR-Horizontallinien. Sobald es verwendet wird, werden mehrere schöne HR-Stile und -Farben als Referenz definiert . Wenn es Ihnen gefällt, kopieren Sie einfach den Code und verwenden Sie ihn.

Die Wirkung ist wie folgt

Einführung in den CSS-Stil zur Definition horizontaler HR-Linien

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
 <title>CSS定义HR水平线</title> 
 <style type="text/css"> 
 <!-- 
.hr0{ height:1px;border:none;border-top:1px dashed #0066CC;} 
.hr1{ height:1px;border:none;border-top:1px solid #555555;} 
.hr2{ height:3px;border:none;border-top:3px double red;} 
.hr3{ height:5px;border:none;border-top:5px ridge green;} 
.hr4{ height:10px;border:none;border-top:10px groove skyblue;} 
 --> 
 </style> 
</head> 
<body> 
<hr class="hr0" /> 
<hr class="hr1" /> 
<hr class="hr2" /> 
<hr class="hr3" /> 
<hr class="hr4" /> 
</body> 
</html>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonEinführung in den CSS-Stil zur Definition horizontaler HR-Linien. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten：
CSS HR水平线
Quelle：php.cn
Vorheriger Artikel：Detaillierte Einführung in Web-Front-End-Wissenspunkte im CSS-Stil Nächster Artikel：Detaillierte Erläuterung der von CSS implementierten Codes verschiedener Formen
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Aktuelle Ausgaben
Wie kann man schwebende Elemente in CSS vertikal statt horizontal stapeln lassen? Ich versuche, eine Webseite mit zwei Spalten zu erstellen, mit Hauptinhalt auf der einen S...
Aus 2024-04-06 20:45:26
0
2
386
So wenden Sie CSS nur auf die horizontale Bildlaufleiste an Ich bin ein neuer Praktikant und sie haben mir eine einfache Aufgabe gegeben: Personalisie...
Aus 2024-04-01 16:25:15
0
2
291
verwandte Themen
Mehr>
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Verwandte Tutorials
Beliebte Empfehlungen
Aktuelle Kurse
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！