Maison interface Web tutoriel CSS Quels sont les préfixes des attributs CSS ?

Quels sont les préfixes des attributs CSS ?

Dec 16, 2020 pm 03:22 PM
css

Les préfixes des attributs CSS sont : 1. "-moz-", qui représente l'attribut privé du navigateur Firefox ; 2. "-ms-", qui représente l'attribut privé du navigateur IE 3. "- ; webkit-" , représente les attributs privés des navigateurs Safari et Chrome ; 4. "-o-", représente les attributs privés du navigateur Opera.

Quels sont les préfixes des attributs CSS ?

(Tutoriel recommandé : Tutoriel vidéo CSS)

Les principaux cœurs de navigateur populaires incluent désormais :

  • Noyau Trident : principalement représenté par le navigateur IE

  • Noyau Gecko : principalement représenté par Firefox

  • Noyau Presto : Les principaux représentants sont Opera

  • Noyau Webkit : Les principaux représentants sont Chrome et Safari

Et les navigateurs avec des cœurs différents, les attributs CSS3 (certains attributs qui doivent être préfixés) doivent être ajoutés avec différents préfixes, également appelés préfixes privés du navigateur. Les attributs CSS3 après l'ajout du préfixe privé peuvent être considérés comme les attributs privés du navigateur correspondant :

  • Noyau Trident : le préfixe est -ms-

  • Noyau Gecko : le préfixe est -moz-

  • Noyau Presto : Le préfixe est -o-

  • Noyau Webkit : Le préfixe est -webkit-

Pourquoi avons-nous besoin d'un préfixe privé ?

Parce que le W3C, l'organisation qui formule les standards HTML et CSS, est très lent. Habituellement, un membre de l'organisation w3c propose un nouvel attribut, tel qu'un rayon de bordure arrondi, et tout le monde pense que c'est bien, mais le w3c n'établira pas de norme pour cet attribut, mais passera par un processus très compliqué et passera par un beaucoup de critiques. Les fournisseurs de navigateurs ne sont pas disposés à attendre aussi longtemps s'ils estiment qu'un attribut est suffisamment mature, ils ajouteront la prise en charge du navigateur.

Mais pour éviter des changements lorsque le w3c annoncera la norme à l'avenir, un préfixe privé sera ajouté, tel que -webkit-border-radius. De cette façon, les nouveaux attributs seront pris en charge à l'avance lorsque le w3c l'annoncera. la norme à l'avenir, border- Une fois la méthode d'écriture standard du rayon établie, les nouveaux navigateurs prendront en charge la méthode d'écriture du border-radius.

Regardons un exemple simple. Pour écrire un rayon de bordure arrondi au début, vous devez l'écrire comme ceci :

.box { 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
-o-border-radius: 5px; 
border-radius: 5px; 
}
Copier après la connexion

Informations étendues :

Le ce qu'on appelle le noyau du navigateur navigue. Le moteur de rendu utilisé par le navigateur détermine la manière dont le navigateur affiche le contenu de la page Web et les informations de format de la page. Différents noyaux de navigateur ont des interprétations différentes de la syntaxe d'écriture des pages Web, de sorte que l'effet de rendu (affichage) de la même page Web dans des navigateurs dotés de noyaux différents peut également être différent. C'est pourquoi les rédacteurs de pages Web doivent tester les pages Web dans des navigateurs dotés de noyaux différents. .La raison de l'effet d'affichage.

Pour plus de connaissances liées à la programmation, veuillez visiter :

Enseignement de la programmation ! !

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 de ce site Web
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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment utiliser Bootstrap en Vue Comment utiliser Bootstrap en Vue Apr 07, 2025 pm 11:33 PM

L'utilisation de bootstrap dans vue.js est divisée en cinq étapes: installer bootstrap. Importer un bootstrap dans main.js. Utilisez le composant bootstrap directement dans le modèle. Facultatif: style personnalisé. Facultatif: utilisez des plug-ins.

Les rôles de HTML, CSS et JavaScript: responsabilités de base Les rôles de HTML, CSS et JavaScript: responsabilités de base Apr 08, 2025 pm 07:05 PM

HTML définit la structure Web, CSS est responsable du style et de la mise en page, et JavaScript donne une interaction dynamique. Les trois exercent leurs fonctions dans le développement Web et construisent conjointement un site Web coloré.

Comment écrire des lignes fendues sur bootstrap Comment écrire des lignes fendues sur bootstrap Apr 07, 2025 pm 03:12 PM

Il existe deux façons de créer une ligne divisée bootstrap: en utilisant la balise, qui crée une ligne divisée horizontale. Utilisez la propriété CSS Border pour créer des lignes de fractionnement de style personnalisées.

Comprendre HTML, CSS et JavaScript: un guide pour débutant Comprendre HTML, CSS et JavaScript: un guide pour débutant Apr 12, 2025 am 12:02 AM

WebDevelopmentReliesOnHTML, CSS, etjavascript: 1) HTMLSTRUCTURESCONTENT, 2) CSSSTYLESIT, et3) JavascriptAdddsInterActivity, Forming TheasisofmodernweBEBExperiences.

Comment utiliser le bouton bootstrap Comment utiliser le bouton bootstrap Apr 07, 2025 pm 03:09 PM

Comment utiliser le bouton bootstrap? Introduisez Bootstrap CSS pour créer des éléments de bouton et ajoutez la classe de bouton bootstrap pour ajouter du texte du bouton

Comment configurer le cadre de bootstrap Comment configurer le cadre de bootstrap Apr 07, 2025 pm 03:27 PM

Pour configurer le framework Bootstrap, vous devez suivre ces étapes: 1. Référez le fichier bootstrap via CDN; 2. Téléchargez et hébergez le fichier sur votre propre serveur; 3. Incluez le fichier bootstrap dans HTML; 4. Compiler les sass / moins au besoin; 5. Importer un fichier personnalisé (facultatif). Une fois la configuration terminée, vous pouvez utiliser les systèmes, composants et styles de grille de Bootstrap pour créer des sites Web et des applications réactifs.

Comment insérer des photos sur bootstrap Comment insérer des photos sur bootstrap Apr 07, 2025 pm 03:30 PM

Il existe plusieurs façons d'insérer des images dans Bootstrap: insérer directement les images, en utilisant la balise HTML IMG. Avec le composant d'image bootstrap, vous pouvez fournir des images réactives et plus de styles. Définissez la taille de l'image, utilisez la classe IMG-FLUID pour rendre l'image adaptable. Réglez la bordure en utilisant la classe IMG-border. Réglez les coins arrondis et utilisez la classe Roundée IMG. Réglez l'ombre, utilisez la classe Shadow. Redimensionner et positionner l'image, en utilisant le style CSS. À l'aide de l'image d'arrière-plan, utilisez la propriété CSS d'image d'arrière-plan.

Comment redimensionner le bootstrap Comment redimensionner le bootstrap Apr 07, 2025 pm 03:18 PM

Pour ajuster la taille des éléments dans Bootstrap, vous pouvez utiliser la classe de dimension, qui comprend: ajuster la largeur: .col-, .w-, .mw-ajustement Hauteur: .h-, .min-h-, .max-h-

See all articles