Maison > Article > interface Web > Comment calculer la taille du modèle de boîte CSS
Comment calculer la taille du modèle de boîte CSS
- 青灯夜游original
- 2020-12-17 11:12:4110027parcourir
La taille du modèle de boîte standard est : "la largeur et la hauteur du contenu + la taille du remplissage des deux côtés + la taille des bordures des deux côtés" tandis que la taille de la boîte IE ; model est directement : "la largeur du contenu "Hauteur", l'attribut largeur/hauteur défini par la boîte est la taille globale de la boîte elle-même. Si elle a un remplissage ou des bordures, cela est obtenu en réduisant la zone de contenu.
L'environnement d'exploitation de ce tutoriel : Système Windows 7, version CSS3, cette méthode convient à toutes les marques d'ordinateurs.
(Tutoriel recommandé : Tutoriel vidéo CSS)
Le modèle de boîte peut être utilisé pour mettre en page des éléments, y compris le contenu réel (contenu) et le remplissage (padding), la bordure (bordure ) et marge (marge).
1. Classification des modèles de boîte
Les modèles de boîte sont divisés en deux types : c'est à dire le modèle de boîte (modèle de boîte bizarre) et la boîte w3c standard modèle .
2. Modèle standard et modèle IE Taille calcul
1. Calcul de la taille de la boîte standard
La taille de la boîte elle-même : la largeur et la hauteur du contenu + la taille de le remplissage des deux côtés +La taille des bordures des deux côtés
La taille de la case sur la page : la largeur et la hauteur du contenu + les marges intérieures des deux côtés + les bordures des deux côtés + les marges extérieures des deux côtés
2 , Calcul de la taille de la boîte IE
La taille de la boîte elle-même : la largeur et la hauteur du contenu
La taille de la boîte occupant la page : la largeur et la hauteur du contenu + les marges des deux côtés
La boîte IE définit directement les attributs largeur/hauteur sur la taille globale de la boîte elle-même. il a des marges ou des bordures intérieures, il est obtenu en réduisant la zone de contenu
Pour plus de connaissances liées à la programmation, veuillez visiter : Introduction à 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!