CURSO de CSS 2021 Rapido y Facil # 2 | 💻 PRIMEROS PASOS

yacklyon

30 May 201907:18

Summary

TLDREn este episodio del curso de CSS, se explica cómo empezar a trabajar con tecnologías de CSS en un archivo HTML. Se muestra cómo agregar CSS directamente en un archivo HTML utilizando la etiqueta 'style' y cómo crear un archivo CSS separado para enlazarlo con el archivo HTML. Se enfatiza la importancia de la selección de elementos, la modificación de propiedades y la creación de enlaces entre archivos para una mejor organización y manejo de estilos en páginas web. Además, se sugiere dividir el editor para visualizar tanto el código HTML como el CSS al mismo tiempo, facilitando el aprendizaje y la implementación de CSS.

Takeaways

😀 El vídeo es parte de un curso de CSS y es el episodio número 2.
🎨 Se explica cómo implementar CSS directamente en un archivo HTML utilizando la etiqueta `<style>`.
📝 Se menciona la necesidad de identificar el tipo de la etiqueta `<style>` con `type="text/css"`.
🌐 Se detalla cómo modificar el fondo de una página web utilizando la propiedad `background` en CSS.
🔵 Se ejemplifica el uso de un color específico ('azul' en inglés 'blue') para el fondo del body de una página web.
✅ Se recalca la importancia de guardar los cambios con `Ctrl + S` para ver los efectos inmediatos en el navegador.
🔗 Se enseña cómo enlazar un archivo CSS externo con un archivo HTML utilizando la etiqueta `<link>`.
📂 Se sugiere la creación de un nuevo archivo CSS llamado `estilos.css` para separar el estilo del contenido HTML.
🛠️ Se recomienda la edición simultánea de archivos HTML y CSS en un editor para facilitar el aprendizaje y la implementación de CSS.
🔍 Se enfatiza la revisión del documento HTML y su traducción al lenguaje CSS para un aprendizaje efectivo.

Q & A

¿Qué herramienta se utiliza para editar el código en el video?
-Se utiliza Visual Studio Code para editar el código en el video.
¿Cuál es el primer paso para implementar CSS en un archivo HTML según el video?
-El primer paso es posicionarse debajo del elemento `<head>` en el archivo HTML y agregar la etiqueta `<style>`.
¿Cómo se identifica un bloque de estilos CSS dentro de un archivo HTML?
-Un bloque de estilos CSS se identifica con la etiqueta `<style>`, que debe contener el atributo `type` con el valor 'text/css'.
¿Qué selector se utiliza en el ejemplo para cambiar el fondo de la página web?
-Se utiliza el selector `body` para cambiar el fondo de la página web.
¿Qué propiedad CSS se usa para cambiar el color de fondo de la página web en el ejemplo?
-Se utiliza la propiedad `background` para cambiar el color de fondo de la página web.
¿Cómo se introduce un color en la propiedad `background` en CSS según el video?
-Se escribe el color en inglés, en este caso 'blue', para establecer el color de fondo.
¿Qué se debe hacer después de escribir el código CSS para ver los cambios en el navegador?
-Se debe presionar 'Control + S' para guardar los cambios y luego se actualiza el navegador para ver los cambios reflejados.
¿Cómo se enlaza un archivo CSS con un archivo HTML para que ambos trabajen juntos?
-Se utiliza la etiqueta `<link>` dentro de la sección `<head>` del archivo HTML, estableciendo el atributo `href` con la ruta al archivo CSS.
¿Cuál es la extensión del archivo creado para contener los estilos CSS en el video?
-El archivo creado para los estilos tiene la extensión '.css', en este caso se llama 'estilos.css'.
¿Cómo se recomienda organizar el editor de código para trabajar con HTML y CSS al mismo tiempo?
-Se recomienda dividir el editor en dos paneles para poder ver y editar simultáneamente el código HTML y el código CSS.
¿Qué se debe hacer al final del video para continuar aprendiendo sobre CSS en el siguiente episodio?
-Se debe revisar el documento 'index.html' y trasladar el código relevante al archivo CSS, siguiendo las prácticas vistas en el video.