Neste curso você aprenderá os fundamentos de HTML e CSS passo a passo com exemplos detalhados. (Clique em “Mostrar mais” para ver os tópicos do curso.) ✏️Curso criado por Estefania Cassingena Navone. Siga-a no Twitter https://twitter.com/EstefaniaCassN
💻 Código no GitHub: https://github.com/estefaniacn/freecodecamp-curso-html-css
⭐️ Conteúdo do curso ⭐️ HTML ⌨️ (00:00:00) Início do curso ⌨️ (00:00:37) Introdução ao HTML e CSS ⌨️ (00:04:09) Ferramentas de desenvolvimento do Chrome ⌨️ (00:06:33) Código Editores ⌨️ (00:10:52) Criar um arquivo HTML ⌨️ (00:15:22) Elementos e tags ⌨️ (00:26:14) Especificar o idioma ⌨️ (00:28:18) Criar cabeçalhos ⌨️ (00:32: 45) Parágrafos ⌨️ (00:36:47) Pesquisar documentação ⌨️ (00:40:23) Comentários HTML ⌨️ (00:44:24) Elemento principal ⌨️ (00:47:39) Recuo ⌨️ (00:51:12) Imagens e atributos ⌨️ (00:59:12) Criar links externos ⌨️ (01:04:10) Links para seções internas ⌨️ (01:12:08) Links com imagens ⌨️ (01:15:40) ) Criar links com # ⌨️ (01:18:56) Listas não ordenadas ⌨️ (01:23:12) Listas ordenadas ⌨️ (01:27:08) Tag forte ⌨️ (01:28:19) Texto em itálico ⌨️ (01:29:26) Tachado Texto ⌨️ (01:30:49) Linha horizontal ⌨️ (01:32:28) Criar formulários ⌨️ (01:35:38) Texto de espaço reservado ⌨️ (01:37:22) Criar um campo obrigatório ⌨️ (01:39:19) ) Botões de opção ⌨️ (01:45:24) Grupo de botões de opção ⌨️ (01:47:00) Alimentação de linha ⌨️ (01:49:48) Caixas de seleção ⌨️ (01 :55:28) O atributo 'marcado' ⌨️ (01 :57:06) O atributo 'valor' ⌨️ (02:00:41) Elementos Div ⌨️ (02:03:16) Rodapé ⌨️ (02:05: 44) Tag pequena ⌨️ (02:06:42) Head CSS ⌨️ (02:09:22) Introdução ao CSS ⌨️ (02:10:50) Três opções para CSS ⌨️ (02:14:55) Estilos embutidos ⌨️ (02:18:10) Elemento de estilo ⌨️ (02:23:11) Arquivo CSS ⌨️ (02:29:25) Seletores CSS ⌨️ (02:33:13) Seletores de classe ⌨️ (02:41:20) Tamanho da fonte ⌨️ (02:48:14) Famílias de fontes ⌨️ (02:55:09) Google Fonts ⌨️ (03:00:38) Especifica como as fontes devem ser degradadas ⌨️ (03:03:52) Redimensionar imagens ⌨️ (03:07:23) Adicionar bordas ao redor de um elemento ⌨️ (03:12:36) Cantos arredondados ⌨️ (03:14:06) Imagens arredondadas ⌨️ (03:15:46) Cor de fundo de uma div ⌨️ (03:18:58) atributo id em CSS ⌨️ (03:25:46) Preenchimento ⌨️ (03:30:37) ) Preenchimento em cada lado ⌨️ (03:32:12) Preenchimento em uma linha ⌨️ (03:33:52) Margem ⌨️ (03:37:37) Ajustar a margem ⌨️ (03:39:26) Margem em uma linha ⌨️ (03:41:49) Preenchimento vs. Margem ⌨️ (03:46:15) Seletores de atributos ⌨️ (03:56:59) Unidades absolutas e relativas ⌨️ (04:09:56) Aplicar estilos ao corpo ⌨️ (04:12:50) Priorizar um estilo em detrimento de outro ⌨️ ( 04:21:02) Prioridade de aula vs. id ⌨️ (04:25:36) Prioridade de estilos embutidos ⌨️ (04:29:14) Códigos hexadecimais para cores ⌨️ (04:35:03) Códigos hexadecimais abreviados ⌨️ (04:39:33) Valores RGB para cores ⌨️ (04:45:23) Variáveis em CSS ⌨️ (04:52:44) Criar variáveis em CSS ⌨️ (04:56:47) Apoiar valores ⌨️ (05:02:09) Compatibilidade entre navegadores ⌨️ (05 : 09:42) Herdar variáveis CSS ⌨️ (05:12:44) Alterar variáveis para uma área específica ⌨️ (05:15:09) Fim do curso 💻 Com freeCodeCamp você pode aprender a programar gratuitamente e atingir seu objetivo de obter um trabalho como desenvolvedor: https://www.freecodecamp.org/espanol/
✍️ Leia centenas de artigos de programação gratuitamente: https://www.freecodecamp.org/espanol/news/
🎥 Inscreva-se em nosso canal para encontrar mais vídeos e cursos de programação: https://www.youtube.com/freecodecampespanol?sub_confirmation=1
source
cursos
⭐ ¡Hola a todos! Muchas gracias por su apoyo. Espero que les guste el curso sobre HTML y CSS. Pueden encontrar un enlace al código inicial de los ejemplos en la descripción del video. Los invito a compartir sus comentarios.
Finalmente encontré el curso que estaba buscando. Más que explicado no se va a encontrar. Aclaro que no tengo ningún conocimento del tema y por eso estoy en ello. Aunque no me sale tal y como se refleja en la web de estudio, es más, solo me salen los dos primeros texto y la imagen del gatito, ya estoy en la parte de ageegar enlaces y todavía no veo la imagen de la lasaña, no obstante sigo consumiendo el contenido. Especial y merecidas GRACIAS a la profesora no solo por compartir gratuitamente sus conocimientos, también por su pedagogía, que es la que ha hecho posible que a mis 46 pueda cogerlo a la primera.
Excelente curso mil gracias!!!
Mientras intentaba linkear mi html con el css para los estilos se me olvido guardar el css y estube 10 minutos viendo si había un error
Hola que tal! Hay alguna configuración que halla que cambiar para poder utilizar el Ctrl + / para hacer que una línea se vuelva un comentario autómaticamente? Porque presionó esa combinación de teclas y no sucede el comentario, se deberá a la instalación de alguna extensión para sugerir correciones de código que instalé o se puede solucionar de otro modo en la configuración? Muchas gracias, no importa si no se puede, solamente quería saber si había una manera de solucionar ese detalle.
@estefania, felicitaciones muy buen trabajo, excelente pedagoga, todo se le entiende a la perfección, he visto dos videos (bootstrap – html/css), sencillamente espectacular como explicas y lo sencillo que hace ver los temas
Tu tienes que ser Venezolana chama, con todo respeto. Que Barbara, tremendo curso, bien presentado y estructurado, me ENCANTÓ. Muchísimas Gracias!
Genial este curso, de verdad me encanto y aprendí mucho, todo muy bien explicado, muchas gracias por este tipo de contenido
Vi esté curso y varios otros suyos también en la aplicación cursa… No sé porque no ponen los más nuevos que tienen.
Saludos
Y muy bueno el curso por supuesto, siempre se agradece que suban está clase de material obviamente.
Saludos
Explica muy pero muy bien! pense que no iba aprender pero pasó todo lo contrario!!! Ámo este canal!!!!
Que capa esta mujer, qué manera de enseñar!, definitivamente naciste para esto…. tienes muy buena pedagogía y se nota que preparas tu contenido antes de dar una clase para que los alumnos entiendan mejor. Termine aquí porque sigo una tecnologia en desarrollo de software y estoy cursando la materia de desarrollo frontend y no le entiendo nada a mi profesor, tienen una plataforma donde dejan clases grabadas y disque recursos pero el man solo dice pongan esto aquí, esto acá y no explica para que sirve que hace eso, uno quiere saber como funciona cierto elemento y en dos semanas no aprendí nada de la unidad de html y css y contigo en 4 días salí aprendiendo más de lo que el profesor me dió y entiendolo que es lo más importante. Ahora estoy en la unidad de bootstrap y es mas de lo mismo, nunca dice para que sirve cada una de las clases que usa si es que lo sabe almenos y lo peor es que pago por la carrera y siendo autodidacta siento que obtengo mejores resultados, por suerte, vi que tienes un curso de bootstrap 5 tambien, genial me salvaste la segunda unidad, aprenderé ahí y le mando las tareas para que no joroben pero eso es lo unico que hacen en vez de explicar bien las cosas, GRACIAS de nuevo un abrazo desde Ecuador! Y siendo subiendo contenido por fa!
Me vi todo el curso aprendi bastante ☺️ y segui mirando mas videos me gusta
Gracias excelente video, salvaste mi semestre
hola buenas tardes, al presionar ALT + Z me salta el configurador de Nvidia Experience, hay alguna forma de hacerlo desde dentro del visual code? gracias un saludo
¡Excelente curso! ¡Acabo de terminarlo y realmente me motivaste a seguir estudiando y mejorando!
la verdad que vi tantos videos de gente que la rompe y esta en la cima. sin embargo me frustro al minuto y vuelvo a Netflix. pero con Estefania terminé descargandome casi todos sus videos y los veo muy despacito mientras espero que me llamen de la lista de la entrada a la carrera en la Universidad Tecnológica de mi pais. Gracias eternas Estefy!
(PD: la lasaña y los gatitos es por Garfield verdad? hahaj)
Holaaa necesito ayuda cuando pongo el código de <h1></h1> y pongo lo que quiero poner no me aparece el texto en mi página al igual que las imágenes y estoy siguiendo todos los pasos ayudas
Hola 50:25 , que se usa en vez de tab o spacio ? Felicitaciones el curso es excelente , gracias
Hola Estefania! Eres GENIAL para enseñar con mucha paciencia y pedagogia, te admiro , un saludo de un mexicano en Texas! Y rumbo al exito!
Puedo decir sin problema alguno, que es el curso gratuito o sí fuera pagando, más fácil de entender y compreder en habla hispana. Estefania eres una gran comunicadora y formadora, gracias por estar en youtube, eres un golpe de aire fresco, ya era hora.
Maestra, al cargar la página (navegador Chrome) no me aparece nada estoy en el procedimiento de poner en la página "hola mundo". ¿Cómo hago que me aparezca el texto ?
No lo he visto completo porque solo tenía duda en los enlaces y termine viendo toda la primera parte que es lo que más necesitaba, fue exelente y la mejor que he visto explicando: TE FELICITO me has ayudado muchísimo.
No tengo palabras, definitivamente, un curso muy didáctico y muy completo. En verdad muchísimas gracias. 😀
la variable tiene prioridad sobre el color de fondo? o porque no solo la ponemos primero ?