Acerca del centrado horizontal de elementos html

1. Centrar el div horizontalmente.

1. Especifique el ancho del elemento y luego centre automáticamente los márgenes izquierdo y derecho.

.center{
   width:100px;
   margin-left:auto;
   margin-right:auto;
  }

2. El bloque en línea implementa el método de centrado horizontal

        Para establecer el atributo de alineación de texto en "centro" en el contenedor principal del elemento

.parent{
     text-align: center; 
 }

.parent li{
          display :  inline-block;
           display inline;
  }

        Desventajas: se requiere un procesamiento adicional de la compatibilidad del navegador de bloques en línea.

3. Método flotante para lograr el centrado horizontal.

        Es necesario determinar el porcentaje del progenitor para lograr el efecto en la sentencia.

.parent{
     float: left;
     width:100%; 
     overflow: hidden;
     position: relative;
 }
.parent li{
           float: left;
            width:50%;
          position: relative;
}

4. CSS3 flex implementa el método de centrado horizontal

  pantalla: flexible; 

   justificar-contenido:centro; 

5. fit-content es un nuevo valor de atributo agregado al atributo "ancho" en CSS

 width: -moz-fit-content;
 width:-webkit-fit-content;
 width: fit-content;
 margin-left: auto;
 margin-right: auto;





Supongo que te gusta

Origin blog.csdn.net/weixin_38791717/article/details/80179850
Recomendado
Clasificación