CSS

Question 1

CUAL ES ES EL MIMETYPE DE CSS?

Answer 1

text/CSS

Question 2

CSS 1 Sintaxis basada en selector global

Answer 2

p {
Color: red;
}

Afecta a todos los elementos p de la pagina

Importante, se pueden poner varios selectores globales, como por ejemplo
p, h1 {
Color:blue;
}

Importante, los ; al final de cada línea son OPCIONALES, AUNQUE ES UNA BUENA PRACTICA

Question 3

CSS1 Sintaxis basada en selector por identificador

Answer 3

p100 {

 Color: green; }

Afecta únicamente al elemento con identificador p100, el cual podrá el párrafo en verde

Question 4

CSS1 Cual es el selector de clase?

Answer 4

Si quiero poner en dos elementos p de la pagina el color azul:
<p class=“importante”>
En CSS :
.importante {
Color:blue;
}
En todo aquel elemento que lleve este selector de clase se aplicara el color azul

Question 5

Qué hace border?

Answer 5

Crea un borde alrededor del elemento al que se especifica. Pueden incluirse le efectos, grosor del borde, etc

Question 6

Que hace padding?

Answer 6

Para entenderlo, teniendo un elemento con un borde, por ejemplo un texto, este texto se desplazaría dentro del borde lo que le indicáramos, por ejemplo:
Padding-left:20 px;

Question 7

Qué significa padding: 10px 20px 30px 40px

Answer 7

Es el orden en el que especificamos el padding para cada dirección:
- 10 px : top
-20 px: right
- 30 px: bottom
- 40 px: left

Un acrónimo para aprenderlo es TRÉBOL

Question 8

Que hace el margin?

Answer 8

Realiza la separación entre elementos (entre cajitas)

Question 9

Novedades de CSS2

Answer 9

• Posicionamiento: absoluto, relativo…
• Primeros tipos de media: @media print (lo contenido en las llaves son estilos que se aplicaran cuando imprimamos la pagina) @media screen(al visualizar la pagina)
• Propiedad z-index: para manejar en altura y profundidad. Es el eje z, sirve para hacer efectos visuales
• Selectores avanzados
• Transformaciones

Question 10

Novedades de CSS 3

Answer 10

• Media queries (MUY IMPORTANTE, PREGUNTADO): extensiones de @media en las que especificamos una posible condicion para que los estilos se apliquen. Por ejemplo, se aplicaran si la zona de contenido tiene como maximo de alto 500 px (responsivo)
• Modules
• mas selectores, animaciones y efectos
• Modelos de colocación de elementos (muy importantes): grid y flexbox. Son metodologías de posicionamiento con muchas posibilidades. (Fue preguntado)

Question 11

Que son las media queries?

Answer 11

Media queries (MUY IMPORTANTE, PREGUNTADO): extensiones de @media en las que especificamos una posible condicion para que los estilos se apliquen. Por ejemplo, se aplicaran si la zona de contenido tiene como maximo de alto 500 px (responsivo)

Question 12

FRAMEWORKS CSS (enumerar algunos)

Answer 12

• Bootstrap
• Materialize
• Foundation
• Bulma

Question 13

Que es un Framework css?

Answer 13

Son conjuntos de estilos ya creados, solo hay que descargarlos y usarlos

Question 14

Preprocesadores CSS

Answer 14

SASS
LESS
STYLUS

Question 15

Que hace un Preprocesador CSS? Importante, ya preguntado

Answer 15

Son herramientas para escribir CSS de una manera más sencilla. Te permite realizar más operaciones que css, ya que te permite tener variables, realizar bucles, realizar mixins (como macros o plantillas).

Sólo son validas para desarrollar en tu propio pc . Este lenguaje no lo entiende el ordenador, de modo que hay que realizar una transformación , por ejemplo del fichero con extensión .less a una hoja de estilo css para que el navegador lo entienda. Esto se realiza mediante un comando de JavaScript