Comment faire un tour de div avec CSS

En CSS, vous pouvez utiliser l'attribut border-radius pour définir un div comme étant rond. Il vous suffit d'ajouter le style "border-radius:50%" à l'élément div. Cette propriété permet d'ajouter des bordures arrondies à l'élément. Le rayon des coins arrondis ne peut pas dépasser la moitié de la largeur/hauteur.

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

Vous pouvez utiliser le pourcentage comme unité pour la bordure arrondie. Par exemple, si vous définissez la bordure arrondie d'un carré à 50 %, un cercle sera formé. Cependant, l'utilisation de pourcentages et de pixels n'est pas équivalente.

Remarque : Une fois le pourcentage supérieur à 50%, la forme ne changera plus. Le rayon du congé ne peut pas dépasser la moitié de la largeur/hauteur.

Exemple :

partie css :

.box1{
width:200px;
height:200px;
margin: 30px auto;
border: 2px solid #e4007e;
text-align: center;
line-height: 200px;
font-weight: bold;
font-size: 24px;
background: burlywood;
border-radius: 50%;//圆角百分比
}

partie html :

<div class="box1">这是一个圆</div>

L'effet est comme indiqué sur la figure :

Apprentissage recommandé : Tutoriel vidéo CSS

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!