Cómo cambiar el contenido en CSS
Este artículo te guiará sobre el cambio de contenido en CSS.
Cómo cambiar el contenido en CSS?
Para cambiar el contenido en CSS, utilizaremos los siguientes métodos:
- :: Después del selector con la propiedad de contenido
- :: antes del selector con la propiedad de contenido
Pasemos por cada método uno por uno!
Método 1: Usar :: después del selector con propiedad de contenido para cambiar el contenido en CSS
El "::después"Selector coloca el contenido especificado después del elemento HTML usando el CSS"contenido" propiedad. Esta operación ayuda a agregar el contenido al elemento seleccionado. Además, el "mostrarLa propiedad se puede utilizar para ocultar el contenido existente.
Echemos un vistazo al siguiente ejemplo para comprender cómo cambiar el contenido en CSS usando el :: After Selector.
Ejemplo
Aquí está nuestra página HTML con el texto "Buen día!!!". Reemplacemos el contenido agregado:
Actualmente, hemos agregado un " Buen día!!! En nuestro archivo CSS, ahora usaremos el selector :: After como "cuerpo :: después"Y usa el"contenido"Propiedad con el valor"Buenas noches"Dentro de su definición. Como resultado, el selector CSS colocará el texto justo después del texto escrito. Por último, esconde el texto existente usando el "mostrar"Propiedad y establecer su valor en"ninguno": Ahora, guarde su archivo HTML y abrérelo simple en el navegador o use "Servidor en vivo"Para el mismo propósito: Como puede ver, el contenido se ha cambiado con éxito utilizando el selector :: After CSS: Método 2: Usar :: antes del selector con propiedad de contenido para cambiar el contenido en CSS En CSS, el "::antesEl selector se utiliza para que el contenido aparezca justo antes del contenido existente de un elemento. Se puede usar en combinación con el "contenidoPropiedad para agregar contenido nuevo al elemento seleccionado. Ejemplo Especifique el selector :: antes justo después del cuerpo como "cuerpo :: antes". Esto colocará el nuevo contenido antes del contenido existente. Tenga en cuenta que todas las demás propiedades siguen siendo las mismas que en el ejemplo anterior: Producción Hemos explicado diferentes métodos para cambiar el contenido en CSS. Conclusión Para cambiar el contenido, "::después" y "::antes"Se utilizan selectores CSS con el"contenido" propiedad. En el primer enfoque, el texto especificado se agrega después del elemento seleccionado, mientras que el segundo selector CSS funciona lo contrario. Además, el "mostrarLa propiedad se puede utilizar para ocultar el contenido existente de un elemento. Así es como el contenido se cambia por completo en CSS. Hemos cubierto los dos métodos para cambiar el contenido en CSS.