Mariposa

Producción

Avanzar hacia la siguiente sección para aprender sobre la imagen de fondo.

Cómo voltear imágenes de fondo usando CSS?

Para voltear imágenes de fondo usando CSS, aplique el "transformar"Propiedad con el"escalax" y "escamoso"Transformar después de acceder a la imagen agregada.

Para hacerlo, siga el procedimiento mencionado.

Paso 1: Container Div Div Style
Acceda al contenedor Div principal con la ayuda del "identificación"Selector a lo largo del nombre de identificación como"#-M-FLIP":

Según el fragmento de código anterior, las siguientes propiedades de CSS se han aplicado al contenedor:

• "color de fondoSe utiliza la propiedad para configurar una imagen en la parte posterior del elemento definido.
• "ancho"La propiedad especifica el tamaño de ancho de un elemento.
• "altura"Se usa para configurar la altura del elemento.
• "margenLa propiedad asigna espacio en el lado exterior del límite definido.

Paso 2: Aplicar el estilo CSS en el contenedor interno
Acceda al contenedor interno con la ayuda del nombre de la clase ".interno":

Luego, aplique las siguientes propiedades CSS:

• "posición"La propiedad especifica el tipo de método de posicionamiento utilizado para un elemento
• "texto alineado"Se utiliza para establecer la alineación del texto.
• "transición"Las propiedades permiten elementos para cambiar los valores en una animación y duración particulares.
• "estilo transformador"Se utiliza para especificar los elementos presentados en el espacio 3D que están anidados.

Paso 3: Aplicar la propiedad "Transformar"
Acceda al elemento Div principal con el nombre de ID a lo largo del ":flotar"Selector y Div interno con la ayuda del nombre de la clase como".interno":

Entonces:

• Aplica el "transformar"Propiedad para establecer la transformación y establece el valor de esta propiedad como"Rotatey (180 grados)"
• "Rotatey ()La función se usa para rotar la imagen en el eje y a 180 grados.

Paso 4: Establecer "Visibilidad de Backface"
Acceda a ambos contenedores Div con su nombre como "#salto mortal hacia delante" y ".volteo"Para establecer la visibilidad:

Para hacerlo, aplique las propiedades mencionadas:

• "Visión de respaldo"Define si la cara posterior de un elemento debe ser visible al enfrentar el usuario.
• "color"Especifica el color para el texto agregado.
• "color de fondo"Establece el color en la parte posterior del elemento definido.

Producción

Eso se trata de voltear una imagen de fondo usando CSS.

Conclusión

Para voltear la imagen de fondo con CSS, primero, agregue una imagen usando el "" elemento. Luego, aplique las propiedades CSS "transición"Y establece el valor. Después de eso, aplique el "transformar"Propiedad para establecer la transformación y establecer el valor de esta propiedad como"Rotatey (180 grados)", Que gira la imagen de acuerdo con el valor indicado. Esta publicación se trata de voltear la imagen de fondo usando CSS.