¿ Qué es AmaWebs?AmaWebs es un Software Constructorde Páginas Webs que le permitirá crear,publicar y mantener su sitio en ...
Aplicaciones que usamos en Amawebs
Pero todas siguen siendoigual, de alguna manera…
¿ Que es HTML ?HTML es el lenguaje con elque se definen las páginasweb.                         ¿ Que es CSS ?            ...
Empezamos                                   Ingresaremos nuestro codigo                                    Vamos a enseñar...
¿ Donde y como instalaremos                                                nuestro código CSS ?Todo los lenguajes de progr...
Pero antes, Conozcamos nuestra Amawebs    Nuestra Amawebs, esta formada por partes, las     cuales cada uno tiene un nombr...
¿ Como cambiamos el fondo de la pagina web ?                                       Este fragmento de código CSS, modificar...
¿ Como borramos los bordes sombreados ?                             Los bordes sombreados en realidad son el fondo de     ...
¿ Como borramos la sombra que tiene el menu bar?                                       Este caso es algo especial, ya que ...
¿ Como borramos los botones del Menú Bar ?                               El nombre que tienen los botones en CSS es «#main...
¿ Como cambiamos de color o de fondo de mi                                        menú principal ?                        ...
¿ Como cambiamos de color o de fondo de mi                                     pie de pagina ?                            ...
¿ Y como puede quedar nuestra pagina Amawebs                                                    ?Veamos un ejemplo..!! Pro...
Recomendación                                            Hábito 2: Comenzar con un fin en menteEl segundo hábito es fundam...
Herramientas Extras                                 En estas paginas podrán encontrar información, utilidades,            ...
Presentación amawebs 1.0
Presentación amawebs 1.0
Próxima SlideShare
Cargando en…5
×

Presentación amawebs 1.0

854 visualizaciones

Publicado el

Publicado en: Educación
0 comentarios
0 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Sin descargas
Visualizaciones
Visualizaciones totales
854
En SlideShare
0
De insertados
0
Número de insertados
2
Acciones
Compartido
0
Descargas
11
Comentarios
0
Recomendaciones
0
Insertados 0
No insertados

No hay notas en la diapositiva.

Presentación amawebs 1.0

  1. 1. ¿ Qué es AmaWebs?AmaWebs es un Software Constructorde Páginas Webs que le permitirá crear,publicar y mantener su sitio en internet.Este Software ha sido especialmentediseñado para Anunciantes Calificadosde AmarillasInternet.com ¿ AmaWebs provee servicio de diseño? Nuestro constructor está diseñado para que cualquier persona, con conocimientos básicos de computación, pueda crear su propio Sitio Web; por eso colocamos a tu disposición la posibilidad de elegir entre centenares de diseños creados por profesionales altamente calificados.
  2. 2. Aplicaciones que usamos en Amawebs
  3. 3. Pero todas siguen siendoigual, de alguna manera…
  4. 4. ¿ Que es HTML ?HTML es el lenguaje con elque se definen las páginasweb. ¿ Que es CSS ? CSS, es una tecnología que nos permite crear páginas web de una manera más exacta. Gracias a las CSS somos mucho más dueños de los resultados finales de la página. Página Web
  5. 5. Empezamos Ingresaremos nuestro codigo Vamos a enseñarle a nuestra Amawebs lo que deseamos que haga, paso a paso, mediante CSS. Objetivo : Hacer nuestras amawebs distintas unas de otrasY que codigo pondremos?Este es un ejemplo de codigo CSS
  6. 6. ¿ Donde y como instalaremos nuestro código CSS ?Todo los lenguajes de programacióntiene una llave de entrada y una llavede salida, es decir que paraenseñarle a nuestro Amawebs sobreCSS, primero tenemos que decirleque vamos a usar código CSS. Ejemplo o Abre la llave de CSS o Este es el nombre del selector que vamos a modificar o Los selectores, también tienen llave de entrada y salida o Nuestro codigo CSS, esta dentro o Y cerramos nuestro CSS
  7. 7. Pero antes, Conozcamos nuestra Amawebs Nuestra Amawebs, esta formada por partes, las cuales cada uno tiene un nombre en CSS, por ejemplo: Cabecera = #Header{}, Menú Principal = #main .menu{} • Cabecera • Menú principal • Cuerpo principal • Fondo de pagina • Menú bar • Sombras de pagina • Pie de pagina
  8. 8. ¿ Como cambiamos el fondo de la pagina web ? Este fragmento de código CSS, modificara el fondo de nuestra Amawebs; recuerden que debe ingresar dentro de las llaves CSS, y no olvidar las {} contenedor de pagina = body{} fondo imagen = background-image:url (url de imagen); Resultado¡ Colocamos el fondo que nos guste !
  9. 9. ¿ Como borramos los bordes sombreados ? Los bordes sombreados en realidad son el fondo de imagen, es por eso que utilizaremos el código background y darle valor NONE , no usar imagen. Cabecera contenedor = #headerContainer{} Cuerpo principal = #mainContainer{} Pie de pagina = #footContainer{} Y borramos fondo imagen = background- image:none; Resultado¡ Ya no tenemos sombras !
  10. 10. ¿ Como borramos la sombra que tiene el menu bar? Este caso es algo especial, ya que si nuestro menu bar, esta a la izquierda, en CSS se llamará «.mainleft» y si esta a la derecha este se llamará «.mainright». Principal izquierdo = .mainleft Fondo = background:none; Color de fondo = background-color:#fff; Nota: Por default es fondo blanco = #fff Pero nosotros podemos cambiarlo al color que nos guste Ejemplo : Gris = #dadada Resultado¡ Desapareció la barrita o sombra !
  11. 11. ¿ Como borramos los botones del Menú Bar ? El nombre que tienen los botones en CSS es «#main .icon1», Donde 1 es el numero del botón, es decir, deben copiar y pegar las mismas propiedades, cambiando el 1, por el 2, 3 y 4, De esta manera se aplicara a todo los botones del menú bar. Aunque podemos borrar los botones de menú bar, este aun esta presente al momento de llenar información, por lo que les recomiendo insertar una tabla. Con el uso de nuestra herramienta TABLA insertamos una tabla, de 900px de ancho y 550px de alto, y color de fondo blanco. Resultado¡ Trabajamos llenando información dentro de nuestra tabla !
  12. 12. ¿ Como cambiamos de color o de fondo de mi menú principal ? En nuestro menú principal, podemos cambiar el fondo que tienen todas las plantillas, por uno personalizado, o desaparecerlo y tenerlo solo como texto, también podemos ponerle un color solido de fondo. Si deseamos poner una imagen a nuestro botón, ingresamos el url de la imagen dentro de las () , o si deseamos quitarle el fondo usaremos - background-imagen:none; Resultado¡ Le quitamos el fondo de imagen del boton !
  13. 13. ¿ Como cambiamos de color o de fondo de mi pie de pagina ? Nuestro pie de pagina en CSS, se llama «#foot». Es importante saber modificar nuestro FOOT, porque tiene que tener relación a los colores y fondos usados de nuestra Amawebs. Si deseamos poner una imagen a nuestro foot, ingresamos el url de la imagen dentro de las () , o si deseamos quitarle el fondo usaremos - background-imagen:none;Resultado¡ Le pusimos un color solido… muy bien !
  14. 14. ¿ Y como puede quedar nuestra pagina Amawebs ?Veamos un ejemplo..!! Probando varios códigos se puede lograr mucha variedad. http://mejores.amawebs.com
  15. 15. Recomendación Hábito 2: Comenzar con un fin en menteEl segundo hábito es fundamental porque para llevar a cabo cualquier cosa quequeramos primero debemos de tener un fin en mente pues para querer hacer algoprimero hay que saber lo que uno persigue para saber como lo va a obtener y quebeneficios o resultados saldrán de eso. Construye tus Layouts Windows 8 – Metro Style
  16. 16. Herramientas Extras En estas paginas podrán encontrar información, utilidades, iconos, colores, códigos, fondos, templates, etc. http://kuler.adobe.com http://www.iconfinder.com http://www.htmlya.com.arhttp://www.templatemonster.com http://bgmaker.ventdaval.com http://www.cssya.com.ar

×