CSS Flashcards
¿Qué tres parámetros (atributos) se relacionan con el “Modelo de Caja” ?
margin
border
padding
¿Qué tipo MIME representa a una hoja de estilos?
text/css
¿Para qué sirve el siguiente selector?
a[title] { … }
selecciona todas las etiquetas a que tengan definido el atributo title
¿Para que sirve el siguiente selector?
[lang] { … }
selecciona todas las etiquetas que tengan definido el atributo lang
¿Cómo se definen reglas específicas para adaptarse a un dispositivo móvil por ej.?
@media only screen and (max-width:640px) { … }
¿Qué se toma como referencia cuando decimos position:fixed?
La referencia es el documento siendo (0,0) la esquina superior izquierda
¿Qué se toma como referencia cuando decimos position:absolute?
La referencia es el contenedor en el que este definida la etiqueta afectada por este estilo
Nombre dos preprocesadores CSS
less
sass
Nombre tres frameworks CSS
bootstrap
foundation
materialize
Nombre dos at-rules
@charset
@font-face
¿Para qué sirve el siguiente selector?
table , a { … }
Se aplicarán los estilos sobre las etiquetas table y sobre a
¿Para qué sirve el siguiente selector?
table a { … }
Se aplicarán los estilos sobre las etiquetas a que estén dentro de una table (en cualquier nivel de profundidad)
¿Para que sirve el siguiente selector?
.texto { … }
Se aplicarán los estilos sobre todas las etiquetas que hayan declarado su atributo class de esta forma:
‹etiqueta class=”texto”› …
¿Cuál es es selector que se refiere a un elemento en base a su identificador?
identificador { … }
¿Para qué sirve este selector y comó se le denomina?
a:hover { … }
Se le denomina pseudo-clase y en este caso el significado es: se aplicarán estilos sobre los enlaces al pasar el raton por encima
¿Para qué sirve este selector y cómo se le denomina?
p::first-letter { … }
Se le denomina pseudo-elemento y en este caso el significado es: se aplicarán estilos sobre la primera letra de los párrafos
¿Para qué sirve la siguiente declaración en un archivo css externo por ej?
p { color:red !important; }
Para forzar a que los parrafos tengan texto en color rojo aunque haya cualquier otra regla (por ej. en el bloque con mayor prioridad/especificidad que intente cambiarlo
¿A que elementos se le aplica la “especificidad”?
A los selectores
https://specificity.keegan.st/ (buenísimo)
¿Qué propiedad(es) de las siguientes no se herendan entre etiquetas padre e hijos sin tener que forzarlo?
color
font-family
margin
text-align
El margin no se hereda por defecto, el resto si
¿Cómo se fuerza a heredar de tu etiqueta padre el valor que tuviera su propiedad float?
selector { float:inherit; }
¿Qué diferencia fundamental tienen estas dos declaraciones?
display:none
visibility:hidden
Aunque las dos provocan que se oculte el elemento, display:none no deja el hueco que ocuparia el elemento y visibility:hidden si deja ese espacio “en blanco”
¿Cómo podríamos preparar el contenido de una pagina para que se imprimiera lo mejor posible?
Modificando todo tipo de estilos de los elementos de la pagina de cara a imprimirse y usando por ej la regla @page para definir todo lo relativo al comportamiento de las paginas en impresión
Con @media print { … } dentro del bloque de la pagina
‹link rel=”stylesheet” type=”text/css” href=”/estilos-impresion.css” media=”print”/›
¿Con que etiqueta podríamos hacer uso de fuentes tipográficas externas?
@font-face
¿Qué tipo de unidad de media es “em” y que significa?
Es una unidad de medida relativa respecto de la fuente actual (contando con la herencia !ojo! )
