Activa JavaScript para disfrutar de los vídeos de la Mediateca.
CSS Tamaño - Contenido educativo
Ajuste de pantallaEl ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:
El tamaño se lo podemos establecer prácticamente a todos los elementos que están en HTML.
00:00:02
Hay algunos que no, hay algunos que no son de tipo bloque, a veces tienen dificultades, pero se lo podemos aplicar.
00:00:06
Entonces, por ejemplo, P, pues aquí tenemos un P normal, que ocupa toda la página,
00:00:12
y aquí hemos dicho que su ancho es el 50%, entonces efectivamente es esta información.
00:00:17
O 20 emes, 20 caracteres, 20 alturas de caracteres, o 200 píxeles, ¿de acuerdo?
00:00:23
Podemos establecer cualquiera de las unidades que tenemos para hacerle trabajar.
00:00:29
Bueno, en el caso de las imágenes es curioso porque el introducir en la hoja de estilos un tamaño de la imagen
00:00:34
tiene más importancia que lo que realmente hayamos puesto en la etiqueta IMG dentro de su ancho y su alto, ¿de acuerdo?
00:00:41
Entonces, bueno, pues es una cuestión a tener en cuenta.
00:00:52
además podemos en las imágenes
00:00:56
pues colocarlas de manera muy curiosa
00:00:59
vamos a ver, vamos a poner aquí la etiqueta
00:01:01
59.35, este es el tamaño
00:01:02
normal, de acuerdo, si digo
00:01:05
que el ancho es 200 píxeles
00:01:07
entonces
00:01:09
de repente deforma la imagen
00:01:10
hacia un lado, si lo digo que la
00:01:12
altura es 100 píxeles la deforma
00:01:14
y si le digo el tamaño
00:01:16
correspondiente pues la pone en ese tamaño
00:01:18
correspondiente, entonces parece
00:01:20
muy interesante para ponerse imágenes en tamaños
00:01:22
como queramos
00:01:25
Podemos establecer también el mínimo ancho, el mínimo alto, el máximo ancho y el máximo alto
00:01:25
Y esto puede ser muy interesante para, por ejemplo, páginas en móvil
00:01:32
Donde queremos que una imagen se vea sí o sí, que no se adapte al dispositivo
00:01:36
Queremos que obligatoriamente su mínimo ancho sea no sé cuál o su mínimo alto
00:01:40
Otra característica es el overflow
00:01:44
¿Qué ocurre si lo que queremos poner no cabe?
00:01:46
Resumiendo, ¿qué hacemos?
00:01:49
Seguimos escribiéndolo aunque se vea mal
00:01:51
lo cortamos, ¿qué es lo que hacemos?
00:01:53
entonces tenemos las propiedades visible
00:01:56
hidden o scroll
00:01:58
o auto
00:02:01
entonces, bueno, pues
00:02:02
auto es el caso en que lo mostraremos
00:02:04
la información siempre que sea necesario
00:02:06
scroll va a mostrar barrera de desplazamiento
00:02:08
siempre, haga o no haga falta
00:02:10
hidden, vamos a ocultar
00:02:12
toda la parte que es sobrante
00:02:15
y visible lo hacemos visible
00:02:17
aunque se salga de nuestro entorno
00:02:18
¿de acuerdo? entonces aquí estamos viendo
00:02:20
visible, como le da igual, el sigue
00:02:22
hidden
00:02:25
como oculta de información
00:02:26
scroll, como el
00:02:28
mete esa información, si le hace falta
00:02:30
y mete además la doble
00:02:32
el doble scroll, tanto horizontal
00:02:34
como vertical, auto, lo que le
00:02:36
hace falta, y en este caso
00:02:38
que hemos puesto el elemento
00:02:40
fuera de la división, que es un propio
00:02:42
texto, pues le hace falta
00:02:44
este scroll y el lo incluye
00:02:46
importante el tema de tamaños
00:02:48
y bueno, sobre todo en el tema de imágenes
00:02:50
cómo colocar las imágenes
00:02:53
- Idioma/s:
- Autor/es:
- Amadeo Mora
- Subido por:
- Amadeo M.
- Licencia:
- Dominio público
- Visualizaciones:
- 98
- Fecha:
- 29 de diciembre de 2020 - 10:04
- Visibilidad:
- Público
- Centro:
- IES CLARA DEL REY
- Duración:
- 02′ 56″
- Relación de aspecto:
- 1.78:1
- Resolución:
- 1364x768 píxeles
- Tamaño:
- 19.34 MBytes
