Bloque3-Tema8-CSS Flashcards

1
Q

Cual es el tipo mime de CSS?

A

text/css

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Que son las media queries?

A

Se utilizan para obtener las características técnicas del dispositivo que solicita la visualización de la página web.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Cual es la ultima version de CSS?

A

CSS3

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Preprocesadores CSS?

A

Less

Sass

Stylus

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Que es el DRY en css?

A

Don’t repeat yourself

There should only ever be one copy of any important piece of information.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Que son las cards de HTML?

A

Las cards son contenedores para presentar una información concreta y destacda dentro de una página web

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Cual es la etiqueta html para incluir contenido CSS de forma interna?

A

<head>
<style>

...
...
...
</style>
</head>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Cual es el atributo para incluir contenido css en una etiqueta de forma local

A

<p>
</p>

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Que son las at-rules

A

Las reglas-at son declaraciones de CSS que instruyen a CSS sobre cómo comportarse

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Para que sirve la at-rule @charset de CSS?

A

especifica la codificación de caracteres usada en la hoja de estilos

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

para que sirve la at-rule @import de CSS?

A

nos permite importar código CSS que tenemos en otros archivos.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

para que sirve la at-rule @media de css?

A

Permiten crear un bloque de código que sólo se procesará en los dispositivos que cumplan los criterios especificados como condición.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

para que sirve la at-rule @font-face de css?

A

Permite al autor especificar fuentes online para visualizar en sus páginas web.

Instalar tipografias.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Es el ; final de CSS obligatorio?

Por ejemplo propiedad: valor(es);

A

No, es una buena practica, pero es opcional.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Como seria la sintaxis de css?

A

p {
color: black;
font-family: Verdana;
}

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Que maneras hay de añadir codigo CSS a un HTML y cual es el orden de prioridadD

A

De menos a mas prioridad

-Fichero css externo
-Etiqueta style (Interno)
-Atributo en una etiqueta (local)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Para que se usa la at-rule @layer?

A

Permite declarar una capa de cascada.

Can also be used to define the order of precedence in case of multiple cascade.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Para que se usa document.queryselector() en javascript?

A

Devuelve el primer elemento del documento (utilizando un recorrido primero en profundidad pre ordenado de los nodos del documento) que coincida con el grupo especificado de selectores

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

Para que sirve el selector #identificador{….} ?

A

seleccion en base al ID.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

para que sirve el selector .clase {….} ?

A

seleccion en base a la clase

<H1 CLASS=”clase>…

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

Para que cirve el selector etiqueta.clase {…}

A

Seleccion las etiquetas del tipo indicado que tengan esa clase.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

Para que sirve el selector etiqueta1,etiqueta2 {…}

A

Sirve para hacer agrupamiento. En realidad son selectores independientes.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

Para que sirve el selector etiqueta1 etiqueta2 {…}

A

Contextuales

Aplica a las etiquetas 2 DENTRO DE etiqueta1 a CUALQUIER NIVEL de profundidad (descendientes)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

Para que sirve el selector etiqueta1>etiqueta2 {…}

A

Etiqueta2 dentro de etiqueta1 directamente(hijo directo)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

Para que sirve el selector etiqueta1~etiqueta2 {…}

A

aplica si etiqueta2 es hermano de etiqueta1

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

Para que sirve el selector etiqueta1+etiqueta2 {…}

A

aplica si etiqueta2 es hermano DIRECTO de etiqueta1

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

Para que sirve el selector E [atributo^=algo]

A

Atributo que empiece por “algo”

28
Q

Para que sirve el selector E [atributo$=algo]

A

Atributo que termine en algo

29
Q

Para que sirve el selector E [atributo*=algo]

A

Atributo que contenga algo

30
Q

Para que sirve el selector E [atributo]

A

Que tenga definido el atributo.

31
Q

Que son las pseudoclases de CSS?

A

Una pseudoclase CSS es una palabra clave que se añade a los selectores y que especifica un estado especial del elemento seleccionado. Por ejemplo, :hover aplicará un estilo cuando el usuario haga hover sobre el elemento especificado por el selector.

32
Q

Que pseudoclases de CSS conoces?

A

:active
:hover
:visited
:invalid
:empty
:required
:first-child
-nth-child()
:not(selector)
:lang()

33
Q

A que hace referencia la pseudoclase :first-child?

A

Representa el primer elemento entre un grupo de elementos hermanos.

34
Q

Para que se usa la pseudoclase :lang?

A

es utilizada para modificar elementos en función del idioma en el que se determina que están

35
Q

Que hace la pseudoclase nth-child?

A

selecciona a los elementos en un grupo de hermanos que coinciden con el patrón especificado.

36
Q

Que hace la pseudoclase not

A

nos ayuda a apuntar con nuestra regla hacia elementos que no coinciden con una lista de selectores

37
Q

que es un pseudoelemento?

A

son una característica de CSS que permite hacer referencias a «comportamientos virtuales no tangibles», dicho de otra forma, seleccionar y dar estilo a elementos que no existen en el HTML

38
Q

Como es la sintaxis de las pseudoclases?

A

selector: pseudoclase {…}

39
Q

cual es la sintaxis de los pseudoelementos?

A

selector::pseudoelemento{…}

40
Q

Que pseudoelementos conoces y que hacen?

A

::after: crea un pseudo-elemento que es el último hijo del elemento seleccionado

::before: before crea un pseudoelemento que es el primer hijo del elemento seleccionado.

::first-line: Permite especificar el aspecto de la primera línea de texto.

::first-letter: Permite seleccionar y dar estilo a la primera letra del texto indicado.

41
Q

Que es la cascada de CSS?

A

Cuando dos o mas reglas coinciden en el mismo elemento, se sigue un orden de importacia para ver cual se aplica.

42
Q

Orden de importancia de la cascada.

A

de - a +

-Estilo ppr defecto del navegador
-Estilos especificados por el usuario
-Estilo relacionados con el documento
*Archivo externo
*Al principio del documento (Etiqueta Style)
*En un elemento especifico (Atributo style)

43
Q

Con que declaracion puedes cambiar el orden de importancia de la cascada?

A

!Important;

H1{
color:blue !important;
}

44
Q

Que es la herencia en CSS?

A

Mecanismo mediante el cual determinadas propiedas de un elemento se transmiten a sus hijos.

45
Q

Que propiedades se transmiten con la herencia de CSS?

A

color

font-

text-

line-height

….

46
Q

Como podrias forzar la herencia en CSS?

A

Con inherit

ejemplo:

P{
background: inherit;
}

47
Q

Especificidad de CSS (A igualdad de importancia)

A

De menor a mayor.

-Elementos y pseudoelementos
-Clases, pseudoclases, atributos
-Identificadores(IDs)
-Estilos en linea

48
Q

Propiedad position de CSS

A

-static (Defecto). Orden natural
-relative -> Movimiento referido desde su posicion static
-Absolute-> movimiento referido en base al contenedor padre.
-Fixed-> Movimiento referido en base al documento.

49
Q

Que hace la propiedad float de CSS?

A

La propiedad CSS float ubica un elemento al lado izquierdo o derecho de su contenedor, permitiendo a los elementos de texto y en línea aparecer a su costado

50
Q

Que hace la propiedad clear de CSS?

A

La propiedad CSS clear especifica si un elemento puede estar al lado de elementos flotantes que lo preceden o si debe ser movido

51
Q

Propiedad display de CSS

A

:none (no renderizada ni el hueco)
: inline (horizontal)
:inline-block
:block (vertical)
:flex (nuevo modelo)
:grid (nuevo modelo)

Nota visibility:hidden si que deja el hueco.

52
Q

Existen en CSS3 textores multicolumna?

A

Si

52
Q

Existen en CSS3 textores multicolumna?

A

Si

53
Q

Unidades absolutas de CSS?

A

-in
-cm
-pc
-mm
-pt
-px
-Q

54
Q

Unidades relativas de CSS?

A

em-> Valor actual del tamaño de fuente dependiendo de la herencia(Tamaño de la fuente inicial de la pagina). Ejem: Si fijo font-size a 18px, font-size: 2em del hijo seria 36px, y luego si bajo otra vez con 2em, el hijo seria 72px.

ex-> “x” igual a la mitad de em

ch-> Ancho del cero

rem-> es igual al font-size del elemento root. Si el font-size del <html> es 16px, 1rem sería igual a 16px en cualquier parte del documento.

%-> Porcentaje

55
Q

Como establecerias el valor de rem?

A

html{
font-size: 14px;
}

esto haria que 1rem=14px en cualquier parte del documento.

56
Q

Imagen ver.

A
57
Q

Que indica width: 100vw; ?

A

Anchura del 100% de la anchura de la ventana graafica.

58
Q

Que indica height:50vh; ?

A

Altura del 50% de la altura de la ventana grafica.

59
Q

Que indica line-height:3vh; ?

A

Altura de linea del 3% de altura de la ventana grafica.

60
Q

Que hace el posicionamiento Sticky?

A

Cuando llega al borde haciendo scroll ya no se mueve y se mantiene

61
Q

Que hace el posicionamiento fixed?

A

se fija base al documento, quiere decir que aunque hagas scroll, sigue ahi.

62
Q

Formatos tipo de letra paginas web.

A

-formato de tipo de letra Web Open Font Format -> .woff o .woff2) ->Existen dos versiones. Se puede definir desde CSS refiriendo a ese fichero.

-Formato de tipo de letra True type-> .ttf y .tte

-Formato de tipo de letra Open Type-> .otf, .otc, .ttf, .ttc

63
Q

Como se definen custom properties (variables) en CSS?

A

–color-destacado: black;

64
Q

Que representa la pseudoclase :root?

A

Represente la raiz del documento, en html es siempre el elemento HTML. Para definir estilos sobre esa pseudoclase.