El selector de solo lectura se utiliza para seleccionar ese elemento que solo se puede leer . El de solo lectura se utiliza para deshabilitar los campos. Principalmente, la pseudoclase de solo lectura representa un elemento que el usuario no puede editar. Sintaxis: :read-only { // CSS property } Ejemplo 1: <!DOCTYPE html> <html> <head> … Continue reading «CSS | :selector de solo lectura»
En este proyecto, vamos a crear botones animados utilizando HTML y CSS. En estos botones, cuando pasamos el mouse sobre ellos, se muestra un emoji para una mejor experiencia de usuario. Vistazo de los botones: Enlace CDN: para los íconos de botones, usaremos el enlace CDN fontawesome. Coloque este enlace en la etiqueta del script. … Continue reading «¿Cómo crear animaciones Hover en Button?»
El selector [atributo$=”valor”] se utiliza para seleccionar aquellos elementos cuyo valor de atributo termina con un valor específico “valor”. El valor no necesita estar presente como una palabra separada. Puede ser parte de otra palabra o expresión, pero debe estar presente al final. Sintaxis: [attribute$=»value»] { // CSS property } Ejemplo 1: <!DOCTYPE html> <html> … Continue reading «CSS | Selector [atributo$=valor]»
El selector marcado se usa para seleccionar todos los elementos marcados en la etiqueta de entrada y los botones de opción. Este selector se utiliza con botones de opción, casillas de verificación y elementos de opción. Sintaxis: :checked { // CSS property } Ejemplo 1: <!DOCTYPE html> <html> <head> <title>checked selector property</title> <style> h1 { … Continue reading «CSS | :marcado Selector»
El selector :indeterminate en CSS se usa para seleccionar cualquier elemento de formulario que esté en un estado indeterminado, es decir, un estado que no está ni marcado ni no marcado. Los elementos a los que se dirige este selector son: <input = “checkbox”> elementos cuya propiedad indeterminada se establece en verdadero por JavaScript Elementos … Continue reading «CSS | :indeterminado Selector»
El efecto de onda de choque también se conoce como efecto de explosión. Es uno de los efectos CSS simples. Para un principiante, es uno de los mejores ejemplos para aprender el concepto de pseudo-elementos. El pseudo-elemento que estamos usando es hover . Te recomiendo que lo revises antes de saltar al código para entenderlo … Continue reading «¿Cómo crear un efecto de onda de choque o explosión usando HTML y CSS?»
El primer hijo es una pseudoclase en CSS que representa el primer elemento entre un grupo de elementos hermanos. El Selector :first-child se utiliza para apuntar al primer elemento secundario de su padre para el estilo. Sintaxis: :first-child { //property } Ejemplo: HTML <!DOCTYPE html> <html> <head> <style> p:first-child { background: limegreen; color: white; … Continue reading «¿Qué es el primer hijo en CSS?»
El menú de la barra lateral es un componente que se utiliza para la navegación vertical. Se puede personalizar y hacer receptivo mediante el uso de HTML y CSS simples. Para hacer una barra lateral plegable, debe tener conocimientos de HTML y CSS para crearla. Ejemplo: en este ejemplo, primero crearemos una estructura usando HTML … Continue reading «¿Cómo diseñar un menú de barra lateral moderno usando HTML y CSS?»
El selector :opcional en CSS se usa para seleccionar y diseñar los elementos de entrada del formulario que son opcionales. Es decir, puede seleccionar aquellos elementos de entrada de un formulario HTML que no están declarados como «requeridos». Sintaxis: :optional { /* css declarations; */ } Ejemplo: <!DOCTYPE html> <html> <head> <title>optional Selector</title> <style> … Continue reading «CSS | Selector opcional»
El selector :empty se usa para seleccionar ese elemento que no contiene ningún elemento secundario (incluido el Node de texto). Sintaxis: :empty { // CSS property } Ejemplo: html <!DOCTYPE html> <html> <head> <title>empty selector</title> <style> h1 { color:green; } div:empty { width: 150px; height: 20px; background: green; } </style> </head> <body> <center> <h1>GeeksforGeeks</h1> <h2>:empty … Continue reading «CSS | :selector vacío»