La reproducción carga el reproductor integrado de YouTube (modo de privacidad mejorada).
Cómo crear una página web con HTML y CSS: Tutorial paso a paso para principiantes
CanalWeb devEn resumen
Vas a construir un encabezado de sitio web sencillo desde cero usando solo HTML y CSS en un editor de texto plano. Este tutorial para principiantes incluye la configuración de archivos, el estilo con imágenes, menús y efectos interactivos como los estados hover —sin necesidad de experiencia previa en programación.
Pasos clave
- Crear un archivo HTML y un archivo CSS vinculado en una nueva carpeta
- Insertar una imagen de fondo guardándola en la carpeta y referenciando su ruta en el CSS
- Ajustar la transparencia de la imagen y añadir efectos al pasar el ratón con CSS
- Agregar un logo, un texto de bienvenida y un botón clickeable al encabezado
Descripción del autor
En este vídeo aprenderás a crear una página web desde cero usando HTML y CSS con el Bloc de notas o cualquier editor de texto. Te mostraré cómo hacer la parte superior del sitio, cómo añadir una imagen de fondo y cómo crear un menú de navegación con HTML. Este es un tutorial completo para principiantes que quieren aprender desarrollo web con HTML y CSS.
Estos son los pasos que verás en este tutorial de creación de webs con HTML:
1. Crear un archivo HTML y uno CSS en una carpeta
2. Vincular el archivo CSS con el HTML
3. Añadir una imagen de fondo en la página web
Para hacerlo, guarda la imagen en la misma carpeta y escribe la ruta completa de la imagen en el archivo CSS para insertarla en la web
4. Crear un menú de navegación en la página web
5. Cambiar la opacidad de la imagen en la página web
6. Añadir un efecto al pasar el ratón con HTML y CSS
7. Insertar un logo en la web usando HTML y CSS
8. Añadir un título (texto de bienvenida) en la página
9. Crear un botón con HTML y CSS
¡Ya has terminado la parte superior de la web con HTML y CSS!
Echa un vistazo a otros vídeos populares de mi canal:
Efecto de imagen al pasar el ratón increíble con HTML y CSS – Zoom entrada/salida || Desarrollo web
Explicación del posicionamiento CSS con ejemplos (estático, relativo, absoluto, fijo)
Efecto de imagen al pasar el ratón con CSS – Tutorial CSS – Efecto CSS3 al pasar el ratón
Cómo cambiar el color de selección de texto en HTML y CSS
Cómo hacer una animación de carga simple con CSS3
Cómo crear un formulario de contacto con HTML y CSS
Cómo hacer un fondo de vídeo a pantalla completa con HTML y CSS
Tutorial avanzado sobre...
Estos son los pasos que verás en este tutorial de creación de webs con HTML:
1. Crear un archivo HTML y uno CSS en una carpeta
2. Vincular el archivo CSS con el HTML
3. Añadir una imagen de fondo en la página web
Para hacerlo, guarda la imagen en la misma carpeta y escribe la ruta completa de la imagen en el archivo CSS para insertarla en la web
4. Crear un menú de navegación en la página web
5. Cambiar la opacidad de la imagen en la página web
6. Añadir un efecto al pasar el ratón con HTML y CSS
7. Insertar un logo en la web usando HTML y CSS
8. Añadir un título (texto de bienvenida) en la página
9. Crear un botón con HTML y CSS
¡Ya has terminado la parte superior de la web con HTML y CSS!
Echa un vistazo a otros vídeos populares de mi canal:
Efecto de imagen al pasar el ratón increíble con HTML y CSS – Zoom entrada/salida || Desarrollo web
Explicación del posicionamiento CSS con ejemplos (estático, relativo, absoluto, fijo)
Efecto de imagen al pasar el ratón con CSS – Tutorial CSS – Efecto CSS3 al pasar el ratón
Cómo cambiar el color de selección de texto en HTML y CSS
Cómo hacer una animación de carga simple con CSS3
Cómo crear un formulario de contacto con HTML y CSS
Cómo hacer un fondo de vídeo a pantalla completa con HTML y CSS
Tutorial avanzado sobre...
Sobre este tutorial
Web dev publicó este tutorial en vídeo de 17:39 el 26 de octubre de 2018. Se ha visto 4.271.531 veces en YouTube.
- Canal
- Web dev
- Categoría
- Educación
- Duración
- 17:39
- Publicado
- 26 de octubre de 2018
- Visualizaciones
- 4.271.531
- Me gusta
- 71.574
Compartir
Este tutorial en otros idiomas
- ENHow To Create A Website Using HTML And CSS Step By Step Website Tutorial
- FRComment faire pour créer un site web en utilisant HTML et CSS étape par étape Site Web Tutorial
- PTComo criar um site usando HTML e CSS Step By Step site Tutorial
- ITCome creare un sito web utilizzando HTML e CSS Step By Step Sito Tutorial
- DESo erstellen Sie eine Webseite mit HTML und CSS Schritt für Schritt Website-Tutorial
- NLHoe maak je een website met behulp van HTML en CSS Step By Step Website Tutorial
- RUКак создать сайт с помощью HTML И CSS Пошаговое руководство сайта
- PLJak stworzyć stronę internetową za pomocą HTML i CSS Krok po kroku WWW Tutorial
- JAステップウェブサイトのチュートリアルでは、HTMLとCSSのステップを使用したA Webサイトを作成する方法
- ARكيفية إنشاء موقع على الشبكة عن طريق HTML و CSS خطوة بخطوة موقع تعليمي
- HIकैसे एक वेबसाइट HTML और सीएसएस चरण का उपयोग करके चरण वेबसाइट ट्यूटोरियल बनाने के लिए
- IDCara Membuat Website Menggunakan HTML Dan CSS Step By Step Situs Web Tutorial