Mas CSS Flashcards
Que es la herencia?
Es el código CSS que el padre le pasa al hijo.
Cuales son los mecanismos que controlan que reglas se aplican en los elementos html?
La cascada y la especificidad.
Algunas propiedades CSS heredan por defecto los valores del elemento padre, pero otras no.
Que concepto es este?
El concepto de herencia.
Que es la cascada en un primer nivel de simplicidad?
Significa que el orden de las reglas en CSS si importan.
Si dos reglas tienen la misma especificidad cual sera la que se aplique?
La que aparece en ultimo lugar en el CSS.
Que mide la especificidad?
Mide cuan especifica es la selección de un selector.
Un selector de elemento tiene una alta especificidad o baja?
Baja.
h1 class=”main-heading”>This is my heading.
.main-heading {
color: red;
}
<br>
h1 {
color: blue;
}
Que color tendra el h1?
Rojo porque el selector de clase tiene mayor especificidad.
Cuando un elemento tiene varias reglas aplicadas como decide el navegador que reglas aplicar?
Con la especificidad.
Si un elemento tiene un width de 50% sus descendientes tendran 50%?
No. Porque no todas la propiedades se heredan.
Cuales son los 3 conceptos que controlan que CSS se aplica a que elemento?
Herencia, especificidad y la cascada.
Cuales son las propiedades que no se heredan en CSS?
width <br></br>
margin <br></br>
padding <br></br>
border <br></br>
Cual es el valor que “activa” la herencia de un padre hacia un hijo?
inherit
Cual es el valor que establece que la propiedad que se aplica a un elemento seleccionado tenga el mismo valor que esta establecido para esa propiedad en el navegador?
initial
Que hace el valor unset?
Restablece la propiedad a su valor natural.
Cuales son las hojas de estilos de agente de usuario?
Son predeterminadas por el navegador.
Cuando se aplican los estilos de agente de usuario?
Cuando no hay otro estilo.
Cual es el orden de especificidad?
inline styles <br> #id <br> .class <br> tag
ul.important
Selecciona todos los elementos ul que tienen una class=”important”
big.wide
Selecciona todos los elementos con id=”big” que tambien tiene una classe=”wide”ora
El selector universal se puede combinar con otros selectores. <br> Que selecciona esto: <br> A *
Selecciona todos los elementos dentro de A
Que selecciona esto: <br></br>
p *
Selecciona todos los elementos dentro de un p
Que selecciona esto: <br></br>
ul.fancy *
Selecciona todos los elementos dentro los ul que tienen class=”fancy”
En el HTML que son los siblings?
Son los elementos que tienen la misma indentación.
Que hace el adjacent sibling selector?
A + B
Selecciona un elemento que le sigue directamente a otro elemento.
Que selecciona esto: <br></br>
p + .intro
Selecciona todos los elementos con class=”intro” que le siguen directamente a un p.
Que selecciona el General Sibling Selector?
A ~ B
Selecciona todos los elementos siblings que le siguen a otro elemento.
Que selecciona el Child Selector?
<br></br>
A > B
Selecciona los hijos (children) B que estan directamente en A
Que permiten hacer los combinadores?
Nos permiten combinar multiples selectores y crear una mayor especificidad.
La medida relativa em.
<br></br>
Que tiene como referencia de medida?
El font-size del elemento actual.
La medida relativa rem.
<br></br>
Que tiene como referencia de medida?
el font-size del elemento root. Por eso la r.
La medida relativa rem tiene como referencia el elemento root.
<br></br>
Cual es el elemento root?
la etiqueta html.
Cual es el font-size por defecto del navegador?
16px
Que hace la propiedad de flexbox stretch?
Estira el contenedor hijo hasta el 100% del contenedor padre
Que necesita el contenedor hijo para que la propiedad stretch funcione?
Que no tenga width o height
En donde se usa la propiedad order?
En el contenedor hijo del flexbox.
Para que se usa la propiedad order?
Para indicar el orden de los hijos en el flexbox.
Cual es la sintaxis de la propiedad order?
order: 1;
Cuando uno de los hijos no tienen indicado un order:
<br></br>
Como se organiza con los demas hijos?
Se organiza a la izquierda y el orden de los demas hijos se organiza con order.
Porque hay que ponerle order a todos los contenedores hijos?
Para que no queden contenedores desorganizados.
Que hace flex-grow?
Especifica el factor de crecimiento de un elemento flexible
En flexbox que es el factor de crecimiento?
Especifica qué cantidad del espacio restante dentro del contenedor flexible, debería ocupar el item en cuestión.
Que pasa con los items si tienen el mismo factor de crecimiento?
Todos los elementos reciben la misma cantidad del espacio restante.
