Brainscape's Knowledge GenomeTM


Top Flashcards (Certified)
All Flashcards

JM Estudio > HTML/CSS > Flashcards

HTML/CSS Flashcards

Resumen del tema html css

1
Q

Motor de renderizado Microsoft Edge

A

Trident -> EdgeHTML -> Blink

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

Motor de renderizado Chrome

A

Webkit -> Blink

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

Motor de renderizado Firefox

A

Gecko <- Quantum (antiguo)

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

Motor de renderizado Opera

A

Presto-> Blink

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

Motor de renderizado Safari

A

Webkit

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

¿Que tipo de etiquetas existen en HTML 5?

A

APIs
Semantica
Multimedia

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

¿Qué elementos conforman una arquitectura web?

A

HTML
CSS
JAVASCRIPT

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

¿Qué preprocesadores de CSS conoces?

A

LESS
SASS
STYLUS

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

Qué es un lenguaje transpilado

A

El proceso convierte de código a código
Typescript, Coffescritp, ES6

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

¿Cómo harias una lista enlazada ordenada en html?

A
  1. Deportes de equipo
    1. Fútbol
    2. Baloncesto
    3. Balonmano
  2. Deportes individuales
    1. Tenis
    2. Boxeo
<ol> 
   <li>Deportes de equipo</li>
      <ol>
         <li>Fútbol</li>
         <li>Baloncesto</li>
         <li>Balonmano</li>
      </ol>
   <li>Deportes individuales</li>
      <ol>
         <li>Tenis</li>
         <li>Boxeo</li>
      </ol>
</ol>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

¿Cómo harias una lista enlazada NO ordenada en html?

A
  • Deportes de equipo
    • Fútbol
    • Baloncesto
    • Balonmano
  • Deportes individuales
    • Tenis
    • Boxeo
<ul> 
   <li>Deportes de equipo</li>
      <ul>
         <li>Fútbol</li>
         <li>Baloncesto</li>
         <li>Balonmano</li>
      </ul>
   <li>Deportes individuales</li>
      <ul>
         <li>Tenis</li>
         <li>Boxeo</li>
      </ul>
</ul>
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

4 Frameworks MVVM

A

Angular
ReactJS
VUE
Ember

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

Puedes nombrar 3 lenguajes transpilados

A

Typescript
Coffeescript
ES6

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

Dos herramientas de automatización

A

Gulp
Grunt

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

Tres herramientas de gestión de dependencias

A

Bower
Yarn
Rpm

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

Conoces algún editor de html/css

A

ATOM
Sublime
VSCode

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

APIs html5

A

Geolocation
Canvas
WebSocket / Server side events
Drag and Drop
IndexedDB
Web Storage (Local, session)
File (control de uploads)
WebWorker
Selector (css)
Microdata/Dataset

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

Etiquetas semanticas html

A

secction
article
nav
aside
header
footer

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

Etiquetas básicas html

A

< div> -> Bloque
< span> -> Inline
< table> -> tabla
< pre> -> texto con formato
< blockquote> -> citas
< ul> / < ol> / < dl> -> Desordenadas / ordenadas / definición
< a> -> Enlaces
< img> -> Imagenes
< iframe> ->
< embed> / < object> -> recursos externos

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

Etiquetas multimedia html

A

< audio [controls/autoplay] >
< video [controls/autoplay]>
< track> -> hijo de audio y video, subtitulos / karaoke
< canva> -> lienzo para dibujar
< svg> -> dibujo vectorial en xml

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

Etiquetas de encabezado

A

< meta name=”keyword / author” charset=”utf-8” >

< link rel=”alternate / stylesheet / prev / next” href=”url enlazada” hreflang=”en / es / fr” media=”only screen and …–para impresion–”

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

Etiquetas de Formulario

A 
< label >

< input min/max="10"  pattern="{a-z}"  multiple placeholder="texto alt" autofocus  autocomplete required
type ="
text
number
range
search
tel
radio
checkbox
selection
time 
email
pwd
color 
date
datetime
submit
" >

< textarea >
< button type ="submit / button / reset">
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

¿Que atributos para elementos de formulario conoces y que uso tienen?

A
  • autofocus -> se posa el cursor a cargar la pagina
  • autocomplete-> activa la opción de autocompletado del navegador
  • min / max -> Minimo valor / Maximo valor
  • pattern (regex) -> formato del campo
  • multiple -> selección multiple
  • placeholder-> Texto explicativo que desaparece al hacer focus
  • required -> campo obligatorio
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

¿Cómo se definen atributos personalizados en html ?

A

data-XXXX

Ej.:
< td data-catergoria=”unaCategoria”
A través de DATASET API de javascript-> objetotd.dataset.categoria

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
¿Podemos definir semantica de tipos de datos? ¿Cómo?
https://schema.org Ej.: < secction itemscope itemtype:"http://schema.org/peson" >

< img itemprop="image" src="foto.gif"> < span itemprop="email" /> < span itemprop="name" />

26
Atributos html 5 globales
id -> Identificador de elemento class -> Estilo que se le aplica al elemento title -> Información al pasar al ratón translate -> yes/no, si debe ser traducido sytle -> Se aplican los estilos directmanete al elemento dir -> Dirección del texto. ltr-> derecha a izquierda. rtl -> lang -> idioma del elemento contenteditable tabindex -> Orden de profundidad del elemento draggable -> Se puede arrastrar. Hay que poner true/false spellcheck -> corrección ortografica.. Hay que poner true/false hidden -> elemento oculto
27
¿Existen atributos para accesibilidad?
Si, role y aria-* Commonly used examples include aria-describedby, aria-haspopup, aria-hidden, aria-label, and aria-labelledby
28
DOM: dos propiedades
Firstchild childnodes
29
DOM: métodos
NODE -> appendChild() NODE -> hasAttributes() DOC -> getElementByName() DOC -> createElement() DOC -> getElementById() DOC -> getElementByTagName() DOC -> getElementByClassName() DOC -> querySelector(selector) DOC -> querySelectorAll(selector)
30
Diagrama DOM
31
¿Qué es polyfills?
Cuando un navegador no implementa de forma nativa un API se puede simular con unos pug-in js llamados polyfills
32
En que versión está CSS y como ha sido su evolución
CSS1 -> Modelo de cajas, estilo de Fuentes, Colores, Texto, Cascada, Psudoclases CSS2.x -> Posicionamiento: Absoluto, Relativo + float / clear Tipos de media: @media print / @media screen Capas: z-Index Selectores avanzados Efectos -> sombras, transformaciones CSS3 -> Media Querys (responsive) FlexBox / Grid Modules (IMP) Animaciones / Efectos / Nuevos Selectores
33
Frameworks CSS
Conjunto de estilos y funcionalidades ya creados para ser usados Bootstrap Foundation Bulma Materialize
34
Cómo funciona un preprocesador como SASS
Con un ejemplo: mixin card($ancho, $alto, $bg, $borde){ with: $ancho; height: $alto; background: $bg; border: $borde } .card1 { @include card(300px, 200px, yellow, red 2px solid); } .card2 { @include card(400px, 300px, blue, black 1px dotted); }
35
¿En qué tres ubicaciones es posible definir estilos css?
* Fichero: Los estilos están contenidos en un 'fichero.css'. * HTML: Los estilos están definidos en el propio fichero html. < style> * TAG: Los estilos están definidos en la propia etiqueta con el atributo 'style'.

36
Cómo se resuelve un estilo si un elemento html tiene varios estilos definidos
Se resuelve en cascada desde menos prioritario a más prioritario Estilos predefinidos Navegador Estilos definidos por el Usuario Estilos definidos por la Página Estilos definidos por la Página !important Estilos definidos por el Usuario !important *Hay que tener en cuenta, si tenemos hoja de estilos y definimos en la propria página con se resolverá por orden, es decir, si importo la hoja.css antes de los estilos en style serán más prioritarios. Si por el contrario importo la hoja.css despues de la etiqueta