Maison >interface Web >tutoriel CSS >Moz Border-Radius (propriété CSS)
Moz-Border-Radius était l'équivalent de Gecko à la propriété Border-Radius de CSS3, bien qu'il différait à quelques égards. La propriété raccourci a permis aux développeurs Web de spécifier les frontières arrondies, ou les arrière-plans arrondis si aucune frontière n'a été définie.
dans Gecko 2.0 Moz-Border-Radius a été renommé Border-Radius; -Moz-Border-Radius a été soutenu comme un alias jusqu'à Gecko 12.0.
Afin de se conformer à la norme CSS3, Gecko 2.0
Remarque: La prise en charge de la version préfixée (-moz-border-radius) a été supprimée dans Gecko 13.0 (Firefox 13.0 / Thunderbird 13.0 / Seamonkey 2.10).
La propriété Border-Radius est une propriété raccourci qui peut accepter jusqu'à quatre valeurs. Les valeurs représentent (dans l'ordre) les coins supérieur gauche, haut-droit, inférieur droit et inférieur gauche. Comme c'est le cas avec toutes les propriétés raccourcis qui utilisent des valeurs unitaires, toutes les valeurs omises sont héritées de celles existantes.
Vous pouvez cibler explicitement les coins individuels d'un élément en utilisant la syntaxe à la main. Par exemple:
.media img { border-top-left-radius: 20%; border-top-right-radius: 20%; border-bottom-right-radius: 20%; border-bottom-left-radius: 20%; }
Vous pouvez voir clairement pourquoi, dans la plupart des cas, vous utiliserez la syntaxe du sténographie. Même si vous souhaitez cibler un seul coin, il est beaucoup plus efficace de le faire à la place:
.media img { border-radius: 20% 0 0 0; }
La propriété CSS -moz-Border-Radius est une propriété spécifique à Mozilla utilisée pour créer des coins arrondis sur des éléments HTML. Il vous permet de spécifier le rayon de la courbe de la frontière, vous donnant le contrôle de la rondeur des coins. Cette propriété est particulièrement utile dans la conception Web pour créer des boutons, des cartes ou tout autre élément qui bénéficient d'avoir des coins arrondis.
La -Les propriétés de la Radius-Radius ont été initialement utilisées pour les navigateurs de Firefox car ils n'ont pas soutenu la propriété standard de la radius frontalière. Cependant, depuis Firefox 4.0 et à partir, la propriété standard de la radius frontalière est pleinement prise en charge. Par conséquent, l'utilisation de -moz-fronts-radius n'est plus nécessaire à moins que vous ne développiez pour des versions plus anciennes de Firefox.
La propriété -moz-border-radius fonctionne en acceptant une ou deux valeurs qui définissent les rayons d'une ellipse quart qui définit la forme de la forme de la forme de la forme de la forme de la forme de la forme de la forme de la forme de coin du bord de la frontière extérieure. La première valeur est le rayon horizontal, et le second est le rayon vertical. Si une seule valeur est donnée, elle est utilisée pour les deux rayons.
Oui, vous pouvez utiliser des pourcentages avec le -moz - Propriété Border-Radius. Le pourcentage est calculé par rapport à la largeur et à la hauteur de la boîte de bordure, et la forme résultante est une ellipse symétrique, ou un cercle si les deux longueurs sont égales.
Le -moz-border-radius est une propriété spécifique au fournisseur utilisé dans les anciennes versions de Firefox, tandis que Border-Radius est la norme Propriété CSS. Les deux propriétés servent le même objectif, qui est de créer des coins arrondis. Cependant, il est recommandé d'utiliser la propriété standard Border-Radius car elle est prise en charge par tous les navigateurs modernes.
pour créer Un cercle utilisant la propriété -moz-border-radius, vous devez régler la propriété à 50%. Cela créera un cercle parfait, étant donné que l'élément a une largeur et une hauteur égales.
Que se passe-t-il si j'utilise des valeurs négatives avec la propriété -moz-frontraire-radius?
Puis-je utiliser la propriété -moz-fronder-radius avec d'autres propriétés de bordure?
La propriété -moz-border-radius est-elle prise en charge dans tous les navigateurs?
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!