Cet article présente principalement l'héritage des valeurs d'attribut en CSS, présente les attributs qui peuvent et ne peuvent pas être hérités, et analyse également les limites de l'héritage et s'il peut être annulé, etc. Vous pouvez consulter l'explication détaillée ci-dessous pour les étapes spécifiques de l'opération. Si vous êtes intéressé, les amis peuvent s'y référer, j'espère que cela pourra aider tout le monde.
Héritage : les éléments HTML peuvent hériter de certains attributs CSS de leurs éléments parents, même si l'élément actuel ne définit pas cet attribut.
Attributs 1.css qui peuvent et ne peuvent pas être hérités
Non héritables : affichage, marge, bordure, remplissage, arrière-plan, hauteur, hauteur min, max- hauteur, largeur, largeur minimale, largeur maximale, débordement, position, gauche, droite, haut, bas, z-index, float, clear, disposition du tableau, alignement vertical, saut de page après, pain de page. avant et unicode-bidi. Tous les éléments héritent : visibilité et curseur. Les éléments en ligne peuvent hériter : espacement des lettres, espacement des mots, espace blanc, hauteur de ligne, couleur, police, famille de polices, taille de police, style de police, variante de police, poids de police, texte - décoration, transformation de texte, direction. Les éléments du bornier peuvent hériter : text-indent et text-align. Les éléments de liste peuvent hériter : style de liste, type de style de liste, position de style de liste, image de style de liste. Les éléments du tableau peuvent hériter : border-collapse.
2. Héritage des valeurs
L'héritage est également basé sur l'arborescence du document. Certains attributs des éléments de l'arborescence du document peuvent être hérités par leur. éléments enfants. Chaque propriété CSS définit si elle peut être héritée. Pour définir certains attributs de style par défaut du document, vous pouvez définir cet attribut à la racine de l'arborescence du document. Si cet attribut peut être hérité, ses éléments descendants hériteront de cet attribut, tels que la couleur, la taille de la police et d'autres attributs.
3. Valeur "hériter"
Chaque attribut peut spécifier la valeur "hériter", c'est-à-dire : pour un élément donné, cet attribut et la valeur calculée de l'attribut relatif de l'élément parent prend la même valeur. Les valeurs héritées ne sont généralement utilisées que comme valeurs de secours, qui peuvent être améliorées en spécifiant explicitement « hériter », par exemple :
🎜> p { font-size: inherit; }
Bien que l'héritage réduise les problèmes liés aux définitions répétées, certaines les propriétés ne peuvent pas être héritées, telles que la bordure, la marge, le remplissage et l'arrière-plan.
Ce paramètre est logique. Par exemple, si une bordure est définie pour un
, si cet attribut est également hérité, alors tous les éléments de ce
résultat. De même, les propriétés qui affectent la position des éléments, telles que la marge et le remplissage, ne sont pas héritées. Dans le même temps, le style par défaut du navigateur affecte également les résultats de l'héritage. Par exemple :
Le texte du titre de niveau 2 ne fait pas 12px.
// Le texte chinois H2 sera un texte de style Titre 2 au lieu d'un texte de taille 12px. body { font-size: 12px; }
En effet, le style par défaut du navigateur définit la règle CSS
.
Dans le même temps, certains navigateurs plus anciens peuvent ne pas bien prendre en charge l'héritage. Par exemple, certains navigateurs perdront tous les attributs hérités lorsqu'ils rencontreront
5. annulée ?
Une fois héritée, la propriété CSS ne peut pas être annulée et ne peut être que redéfinie.
6. Cas
Position de l'élément parent : relatif Élément enfant : position : absolue La largeur de l'élément parent est fixe et l'élément enfant héritera de la largeur de l'élément parent (pour la navigation secondaire, c'est très important. Lorsque la largeur de la barre de navigation masquée n'est pas fixe, ou que la largeur est plus grande que l'élément parent, la largeur de l'élément enfant ne peut généralement être réinitialisée qu'à ce moment)
Recommandations associées :
Introduction à l'héritage des valeurs d'attribut en CSS
Javascript pour obtenir des valeurs d'attribut CSS spécifiques_Échange d'expérience
Explication détaillée de l'utilisation de la valeur de l'attribut 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!
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
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
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.
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-
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.
La fonction de téléchargement de fichiers peut être implémentée via Bootstrap. Les étapes sont les suivantes: introduire les fichiers Bootstrap CSS et JavaScript; créer des champs d'entrée de fichier; créer des boutons de téléchargement de fichiers; gérer les téléchargements de fichiers (à l'aide de FormData pour collecter des données, puis envoyer au serveur); style personnalisé (facultatif).
Réponse: Vous pouvez utiliser le composant de sélecteur de date de bootstrap pour afficher les dates dans la page. Étapes: Présentez le framework bootstrap. Créez une boîte d'entrée de sélecteur de date dans HTML. Bootstrap ajoutera automatiquement des styles au sélecteur. Utilisez JavaScript pour obtenir la date sélectionnée.
Pour vérifier les dates dans Bootstrap, suivez ces étapes: introduisez les scripts et styles requis; initialiser le composant de sélecteur de date; Définissez l'attribut Data-BV-Date pour activer la vérification; Configurer les règles de vérification (telles que les formats de date, les messages d'erreur, etc.); Intégrez le cadre de vérification de bootstrap et vérifiez automatiquement l'entrée de date lorsque le formulaire est soumis.
Bootstrap fournit un guide simple pour configurer les barres de navigation: l'introduction de la bibliothèque bootstrap pour créer des conteneurs de barre de navigation Ajouter l'identité de marque Créer des liens de navigation Ajouter d'autres éléments (facultatif) Styles d'ajustement (facultatif)
interface Web
