Attribut de position centrage horizontal absolu et relatif dans le style CSS

Nous devons d'abord comprendre ces deux types de positionnement dans les styles ;

absolu (positionnement absolu) : faites glisser l'objet attribué hors du flux de documents et utilisez les attributs gauche, droite, haut, bas et autres pour relatif Effectuer un positionnement absolu sur l'objet parent le plus proche avec des paramètres de positionnement. Si le parent n'a pas d'attributs de positionnement définis, il sera défini selon les règles par défaut (positionnement basé sur le coin supérieur gauche du corps comme référence). en même temps, l'objet absolument positionné peut tomber en cascade.

relatif (positionnement relatif) : les objets ne peuvent pas se chevaucher. Utilisez les attributs gauche, droite, haut, bas et autres pour les positionner dans le flux de documents normal. Leurs objets ne peuvent pas être mis en cascade.

Centrage :

1. Afin d'obtenir l'effet de centrage adaptatif pour les objets qui utilisent le positionnement absolu, la largeur de l'objet doit être définie par exemple, le code suivant implémente le centrage ;

.ceshi
    { 
        position:absolute;
        bottom: 10%;
        display: block;
        width: 250px;
        left:50%;
        margin-left:-125px;
        }

2. Pour l'objet qui utilise le positionnement relatif pour obtenir l'effet de centrage, car il se trouve dans le flux normal du document, son objet de référence est lui-même et les paramètres suivants peuvent être définis :

.ceshi2
{
margin：0 auto;
}

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!