Web ejemplo - Ejemplo de una página web desde cero en HTML y CSS - mastersitios.com
Вставка
- Опубліковано 10 лют 2025
- (suscribete) Sigue el ejemplo aqui mastersitios.co...
En este vídeo muestro como empezar desde cero a construir un sitio web, utilizando solo HTML y CSS, Desde el código básico, pasando por la maquetación, crear cabecera, menu, columnas y pie de pagina. Hasta tener el sitio completamente terminada y bien diseñado.
Llevo 13 minutos y de momento creo que esto es lo que andaba buscando. Gracias
Muy útil la información que ofreces y te he dado like, peroooooo, ha habido momentos que me dormía :) Ánimos. Gracias por todo.
23:15 te lafto restar 4 de los dordes de cada columna y en verdad excelente trabajo, me ayudó mucho....
Amigo Quiero felicitarte Amigo tengo 14 años y me gusta mucho esto de crear paginas web. En mi cole estamos viendo esto en computacion y presisamente mañana tengo examen pero como ami me gusta ir un paso adelante de los demas lo voy a hacer con css y no normalmente con html. Gracias amigo te felicito, Gracias por subir este video lo vi completo y me ayudo bastante Gracias Feliz Noche
que tal te fue el examen jajajja
@@zeuslannister3456 sigo con la duda
genial jejeje ahora mismo lo estoy viendo y siguiendo paso por paso jejej ovio que ami estilo pero neta me as ayudado bastante con tu video jejeje
Muchas gracias. Excelente video me sacaste de un apuro que ni te imaginas.
muchas gracias... te mereces muchos mas suscriptores... me sirvio demaciado... muy bien explicado.. y tambien se ve todo lo que haces paso a paso eso esta genial ... no entendia lo de como se ven los margenes gracias a ti ya logre hacer mi trabajo!!! Gracias nuevamente
Muy bueno el video. Parece que somos muchos que no sabemos maquetar, organizar, y ordenar_etiqueta →ul y etiqueta li→lista ordenada... Te agradezco inmensamente por esto video tutorial.(a veces uno sabe algo , pero desde ese punto a ORDENAR,,, HAY CASI UN AÑO LECTIVO DE DISTANCIA)
Lo de programacion y hacer paginas web me costaria tiempo aprender pero poco a poco practico buen Tutorial Mastersitios :)
Muchisimas Gracias me ayudaste y resolviste todas mis dudas conforme el pasar del video... GENIAL ;)
Primero que todo muchas gracias por este tutorial y por dedicar tu tiempo a ello,Espero sigas subiendo mas tutos porque ya te sigo vale.
2
toma tu like buen hombre estaba buscando este tuto para un proyecto en php de un sistema de inventario
Excelente! Gracias a vos entendí la maquetacion básica, gracias! Diez puntos. Abrazo
amigo! me ayudaste mucho te agradezco que hayas hecho el esfuerzo de hacer este tutorial ! gracias ! espero que vuelvas a hacer algún tutorial mas sobre paginas web un saludo (y)
gacias por tu tiempo.. para realizar este buen tutorial ..
muy bueno!! gracias por el video! espero ver más tutoriales! saludos...
Me parece excelente el contenido del tutorial y de la filosofia del contexto
Gracias! Buen vídeo me ha ayudado mucho.
Gracias, muy bueno, solucione un gran problema,
gracias me sirvio mucho tu vieo espero subas mas y ya con las conexiones a php y mysql gracias
Excelente!!!! Me ayudo Mucho Gracias!!
con este tuto si aprendi
de mucha ayuda sigue así hermano.
buena esa explicacion, solo que me gustaria que no improvisaras para q no existiera muchos saltos pero me ayudo al 80% gracias mano... saludos
Oye mi chavo, excelente tutorial. Gracias!
Muchas dudas aclaradas, gracias master!!!
Gracias :) , espero ver más tutoriales ;P
Me ha servido bastante. Gracias...
Quisiera ver la 2da parte...la primera es excelente, Gracias!!
i love you man, i couldn't with this, and your help is really helpful
excelente tutorial gracias por tu gran aportacion
muy bien detallado gracias
¡Muchas GRACIAS !!!
crack enseñas muy bien me sirvio
muy buen video,,felicitaciones
Excelente video!!
Felicitaciones, muy bueno el video, como sugerencia ojala en los proximos videos no des tanta vuelta, ya que hay momentos en que se vuelve aburridor,
buenisimo el tuto, tengo un problema... el contenido dentro de los se me desbordaa, copie el codigo al pie de la letra pero tampoco,, saludos
Muchas graciasprofesor!!!!
muchas gracias exelente explicasion
Excelente tutorial!!! Gracias : - )
esta muy bueno el tuto donde consigo la siguiente parte gracias
Digamos una pregunta si tuvieras que hacer un diseño antiguo para computadoras viejas como para Windows 98 y Windows 95 Se podrían hacer como un navegador para esas computadoras algo así qué y diseñar un sitio web donde pueda subir varias tipos de literatura antigua Cómo libro de cocina y eso
Muito bom, continue sempre assim. eu estarei sempre contigo.
Muy buen video muchas gracias
Excelente video gracias...
buen aporte. muchas gracias
id y class se usan casi para lo mismo pero no es para darle prioridad a uno u otro elemento , la diferencia radica al aplicar la referencia en la hoja de estilos, en las buenas practicas mientras que id es un identificador para aplicar estilo a un div de forma individual, class se utiliza para aplicar estilo a un conjunto de divs que contenga la misma clase como referencia.
exacto, gracias por aclarar el uso de id y class, saludos
exelente muchas gracias
muy bien explicado varón.... ahora solo quiero saber como pongo las imágenes de manera adecuada dentro de los contenedores estoy usando el netbeans si alguien me lo dice sería excelente andaré buscando en otros lugares tbm (Y)
Muchas gracias.
me sirvio mucho gracias
cierto!!! seria genial que ordenaras tus etiquetas solo eso... por se confunde donde cierra donde habren... pero todo genial
+Javier ivan Tellez Flores hablo de tablador
Hola buen ejemplo. Podrias enseñarme como puedes hacer el mismo ejemplo con los nuevos encabezados de html 5: como article section nav footer no se cual me falta. Si pudieras por fa. Gracias
excelente tutorial me ayudo mucho, pero falto como poner videos en la pagina web
aun así gracias
Marter...!!! Gracias!!!
David angel bolaños
Por aqui David, recordando algo de programación solo que enfocada al web... luego te páso información de mi nuevo proyecto... creo que podrás involucrarte...
Vladimir Pérez tu tienes un familiar ruso no??
jajajaja NO para nada.... solo tengo el nombre ruso.
se puede usar tambien bloc de notas normal?
hola me parece excelente, pero donde esta la otra parte, por favor
amigo @Mastersitios
siguiendo los pasos como los vas dictando no reconoce la parte de estilos.css
en tu tutorial va creando como carpetas y en el que yo voy estoy realizando no se a que se deba, igual tienes como una camarita en tu barra de escritorio que veo que le das click y solo te pega los datos
me quede en stand bye
no enmarca el titulo
muy bueno el video pero para la proxima haslo mas corto uno se aburre con video tan largo
einstein, la teoría del agua te dio trabajo.
en el minuto 9:00 escribiendo el codigo que me lo produjera el xampp en crome no funciono. pero si funciono cuando copie la dirección de la carpeta con el archivo html. si me funciono en el internet exploret de ambas formas con el xampp y con la dirección de la carpeta con el archivo html.
amigo como convierto todo una pagina ya echa de html en css ?
o tengo que hacerla de nuevo
Excelente y muy explicado, lastima que ya no hay continuación :(
exelente 2015
(y) bien explicado
buenas porque cuando abro la pag web no me aparece el ejemplo que estoy poniendo que es lo que pasa
otra cosa de donde sacas el codigo para poder centrar la pag
en ejemplo que hago no me salen los bordes en la pag. web
Hoy en día bastante del contenido que se enseña en el vídeo se consideran malas prácticas, o por lo menos poco efectivas. Para hacer la maquetación busquen tutoriales de "css grid" o "css flexbox.". Y si ven muchos divs en los documentos HTML algo no se está haciendo bien, no soy un experto, pero los estándares de hoy en día establecen que hay que maximizar en todo lo posible que los bloques de contenido sean semánticos, hay etiquetas para las cabeceras y los píes de página si los necesitan, "main" contiene la parte principal de la página y de ahí en adelante.
por favor puedes hacer la segunda parte men porfa
lo que hago en CSS no funciona, estoy en explorer y windowa 10. Ayuda gracias
VAYA QUE NO PUEDO ESCRIBIR DENTRO DEL HEAD SINO APARTE QUIZAS AL EMPEZA A UTILIZAR EL NOTEPAD++ NO SE COMO DESPLEGAR ??espeor respuesta y muchas gracias genial si alguien me puede ayudar
urgente porfa por que no me salen los codigoss asi en colores como en el video oorfa
Hola tengo un problema super grande
Quiero poner este codigo que tiene un estilo de menú que yo quiero poner
/* el menú en si mismo */
.mi-menu {
border-radius: 5px;
list-style-type: none;
margin: 0 auto; /* si queremos centrarlo */
padding: 0;
/* la altura y su ancho dependerán de los textos */
height: 40px;
width: 645px;
/* el color de fondo */
background: #555;
background: -moz-linear-gradient(#111,#111);
background: -webkit-linear-gradient(#555,#222);
background: -o-linear-gradient(#555,#222);
background: -ms-linear-gradient(#555,#222);
background: linear-gradient(#555,#222);
En que parte sel codigo html se lo agrego????
Se me enreda con el codigo en CSS
quisas mi respuesta llego tarde pero te lo voy a decir de todos modo,
sdfjkufhuidufh
y a quei dentro es donde va tu css osea el, border-radius padding y todo eso.
AMIGO CUAL ES LA DIFERENCIA ENTRE UN ELEMENTO Y UN CONTENEDOR EN HTML5 Y CSS3
amigo nesecito que me digas como pongo un fondo en mi pagina web,ya intente con backgroun (como se escriba) y con img,y no puedo porfa ayuda!!!
en Css al body le das un background-image: url("ruta de la imagen");
que programa utilisa para imagens de fondo
carlos zuñiga se llama GIMP , puedes buscarlo en google
+Mastersitios no lo encuentro
Dame el link plis
como consigo el codigo de 4:56minuto ayuda porfa
no entiendo xq cuando le doy guardar al el ejemplo html en la carpeta no se me pone la extensión solo se pone en texto en notepad ++
e lo tenes queponer vosla extension .html
de donde saco el codigo en el minuto 11:00 ayudenme porfavor.
+joss Frito mil Hola, puedes hacerlo solamente asi:
aqui contenido
no me sale nada de estilos.css lo pongo identico y sale como si no puse nada, ayuda
me pasa lo mismo
pero ke ierda tengo ke aser para ke se guarde porke puse guardar y no e aparese el orde ese
si es para que salgan esos signos de menos en los nombres tenes que cambiar el .txt por .html y por .css
en que minuto empieza la maquetacion que aparece en la foto del video
14:20 :V
donde esta el otro video?
+Kamilo Bianco Nunca lo hizo
Al menos se esforzo haciendo un video de 1 hora
no se porque no me sale copio todo tal como lo pones tu la diferencia es que mi carpeta se llama html y esta en el escritorio y no los puedo enlasar
si me ayuda me aria un favor enorme
tienes que guardar los codigod html con html.index y los css con estilos.css en la carpeta css
a mi no me sale lo del borde de la pagina
ni ami :,v
amigo no puedes pasar la plantilla los codigos y todo eso
pagina web ya no funciona actualiza los links
PAna ayudeme con ese ejemplo si porfavor gracia sde antemano
Gracias
Soy nuevo en esto, puedes por favor hacer un video tutorial y enseñar como crear un sitio como el tuyo "mastersitios.com/index.html"
Es decir que contenga ese MENU "Inicio" | "Quienes Somos" | "Proyectos" | "Precios" | "Cotizador | ... y al hacer clic sobre estos la información se cargue más abajo (espero hacerme entender) GRACIAS
Me podrias pasar el codigo por favoor?
Las columnas no me salen.
alguien tiene el codigo fuente en bloc de notas que me pueda compartir
como hacer un maquetacion en php
oye los codigos me los puedes mandar a mi correo x f te lo agradesco mucho saludos
me podrian dar el codigo por favor
no me agrega la imagen al menu :S
Alguien me puede dar la imagen de header plis
sigo los paso y nada cambia