Maison > Article > interface Web > Introduction au style CSS définissant les lignes horizontales RH
Introduction au style CSS définissant les lignes horizontales RH
- 高洛峰original
- 2017-03-27 18:00:454408parcourir
CSS définit plusieurs styles de lignes horizontales HR. Ne sous-estimez pas les lignes horizontales HR. Une fois utilisé, il ajoutera beaucoup de couleur à votre page Web. Ce morceau de code définit plusieurs beaux styles et couleurs HR pour votre référence. . , si vous l'aimez, copiez simplement le code et utilisez-le.
L'effet est le suivant
<!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>Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Introduction détaillée aux points de connaissance du style CSS frontal WebArticle suivant：Introduction détaillée aux points de connaissance du style CSS frontal Web