Maison > Article > interface Web > Comment écrire un seul côté des coins arrondis en CSS
Comment écrire un seul côté des coins arrondis en CSS
- WBOYoriginal
- 2021-12-06 11:28:303410parcourir
Écriture : "border-radius : valeur arrondie en haut à gauche, valeur arrondie en haut à droite, valeur arrondie en bas à droite, valeur arrondie en bas à gauche ;" ; l'attribut "border-radius" est utilisé pour définir le style des coins arrondis de l'élément et les valeurs. des attributs peuvent être définis séparément. Pour la valeur arrondie des quatre coins de l'élément, il vous suffit de définir la valeur de l'attribut arrondi sur "0" si vous ne souhaitez pas afficher les coins arrondis.
L'environnement d'exploitation de ce tutoriel : système Windows 10, version CSS3&&HTML5, ordinateur Dell G3.
Comment écrire un seul côté des coins arrondis en CSS
En CSS, vous pouvez utiliser l'attribut border-radius pour afficher un seul côté des coins arrondis. Cet attribut est utilisé pour définir le coin arrondi. style de l'élément.
La syntaxe est :
border-radius：左上圆角值 右上圆角值 右下圆角值 左下圆角值；
L'exemple est le suivant :
<!DOCTYPE html>
<html>
<head>
<style>
div{
border:2px solid #a1a1a1;
height:350px;
background:#dddddd;
width:350px;
border-radius:25px 25px 0 0;
}
</style>
</head>
<body>
<div></div>
</body>
</html>Résultat de sortie :
(Partage vidéo d'apprentissage : 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!