1illustrator Graphix

Nº 1 MX $30 AR $24.9 Graphix

índice GraphixÍndice

Carta Editorial

Novedades en CS5

Illustrator¿Cómo crear botones web desde Illustrator?

PhotoshopDando un aspecto lúgubre a tus fotos

FlashCreando una Galería Web

DreamweaverComenzando a usar Dreamweaver

7

11

3

4

17

20

BIENVENIDOSGraphix nació hace sólo 2 semanas como una propuesta de una nueva publicación destinada a la comunidad de diseñado-res. Es un espacio para que ustedes mismo puedan publicar sus trabajos, comentarios y opiniones así como algunos tips en algunos de los programas de diseño para facilitar nuestro tra-bajo. Debemos recordar que el diseño es clave y forma parte de todos los aspectos de nuestra vida. Nuestro mayor deseo es que esta revista se convierta en una pieza escencialque faltaba en la comunidad de diseñadores de Quintana Roo y México.

4 Novedades CS5 Graphix

novedades en CS5 Graphix

Novedades en CS5La llegada de las nuevas versiones de Photoshop y compañía siempre han provocado emoción con la cantidad de novedades que prometían.

Relleno según el con-tenido (Content Aware Fill)

Relleno según el contenido es una de las novedades que trae el Photoshop CS5, pero es una de las mejores y más impresionantes herramientas que jamás tuvo el programa, por su simplicidad y el tiempo que nos puede ahorrar.Esta herramienta realiza en forma automática la remo-ción de grandes objetos y es capaz de extender la imagen hacia un lado, cosas que normalmente hacemos con él tampón de clonar en forma manual.Sin embargo clonar áreas grandes suele ser difícil, en especial si hay un gradiente

de color (como en el cielo), una textura compleja o si no tenemos ‘datos suficientes o adecuados’ sobre los cuales basarnos.Relleno según el contenido (Content Aware Fill) simplifica tanto la operación que ni siquiera tenemos que realizar una selección precisa sobre el área que queremos remover. Tan solo realiza una selección (a través de cualquier her-ramienta de selección) que abarque la totalidad del área y un poco más. Luego selecciona la herra-mienta, desde el menú Edición > Relleno (Edit > Fill) o simple-mente presiona Shift + F5.En el cuadro de diálogo que se abre asegurate de utilizar la opción Según el contenido (Content - Aware) que se encuentra en el primer menú

desplegable.zPresiona OK y en unos instan-tes verás como el área selec-cionada es reemplazada por una textura muy precisa con-struida a partir del entorno de la selección. Luego presiona Ctrl D para remover la selec-ción y así ver bien el resultado.En la siguiente imagen puedes ver como a través de dos op-eraciones separadas extendi-mos la imagen a la izquierda y eliminamos los edificios.

En la mayoría de los casos los resultados serán bastante aceptables, incluso en imá-genes muy complejas en donde la misma tarea manu-almente demandaría mucho tiempo o sería muy difícil

5Novedades CS5 Graphix

obtener resultados realistas. Y si los resultados no son de tu agrado, estas son algunas de las opciones que tienes

* Deshacer la operación y realizar una nueva selección para repetir el proceso.

* Realizar un nuevo relleno sobre parte del existente, o mejorar el área a través del tampón de clonar (clone tool) o las herramientas pincel repa-rador (spot healing) o parche (patch).

* Refinar el borde de la selec-ción, con esta otra nueva her-ramienta del Photoshop CS5 que mostramos mas abajo.

Herramienta Pincel Correctovvr Puntual según el contenido (Spot healing con Con-tent Aware)

Esta herramienta ha sido me-jorada en el Photoshop CS5, para permitir utilizarla ‘según el contenido’. Es similar a la herramienta Clonar, pero con esta herramienta no debe-mos seleccionar un origen en el cual basarnos. Photoshop analiza los píxeles alrededor del área cercana para cubrir ese sector. Brinda resultados bastante aceptables de manera rápida en el arreglo de este tipo de imperfecciones puntuales, y apartir de la versión CS5 es ca-paz de trabajar correctamente cerca de bordes y líneas, resultando herramienta útil para, por ejemplo, remover los

cables que pueden estar cru-zando el frente de un edificio.Simplemente selecciona la herramienta (desde el menú de herramientas o con la tecla J) y asegúrate de que una vez seleccionada la herramienta elijas de su barra superior la opción Content Aware.Esta nueva herramienta trabaja de la misma manera que Relleno automático según el contenido (Content Aware Fill), solo que esta última her-ramienta es utilizada para remover o crear grandes áreas de la imagen a través de una selección, como acabamos de mostrar.En el siguiente ejemplo de manera simple y casi sin tener que pensar removimos casi to-das las aberturas y elementos de esta imagen algo compleja. Simplemente ‘pintamos’ con esta herramienta todo lo que queríamos remover. No llevó ni un minuto hacerlo.

6 illustrator Graphix

illustrator GraphixIllustrator es una herramienta que nos permite crear vectores pero en esta ocasión la ocuparemos para la creación de elementos WEB. Cualquier duda, consultanos ómándanos un correo electróinico: doubts@graphix.com.mx

8 illustrator Graphix

illustrator Graphix

Creando un botón WebIllustrator es una herramienta que nos permite crear vectores pero en esta ocasión la ocuparemos para la web.

Paso 1: En Illustrator, creamos un documento nuevo de 640 x 480. Usaremos pixeles como unidad de medida.

Paso 2: Creamos un círculo de 200 x 200 px y un rectángulo de 365 px x 115 px lo cuales ubicamos tal como se ve en la imagen.

Paso 3: Seleccionamos el rectángulo, vamos al menú Effect>Stylize>Rounded Corners... y en la casilla Radius aplicamos un valor de 20 px, posteriormente vamos al menu Object y seleccionamos el co-mando Expand Appearance.

Paso 4: Seleccionamos tanto el círculo como el rectángu-lo, vamos al menú Window y seleccionamos Pathfinder y hacemos click en el primer botón de este panel (Unite). El resultado es una sola figura a la cual le aplicaremos 5% de gris como relleno, 20% de gris al contorno y un espesor de contorno de 2 pt.

Shape Builder Tool (Herramienta Creador de formas): combine de forma intuitiva, edite y rellene las formas directamente en la mesa de trabajo. Arrastre el cursor por los trazados y formas superpuestas para crear nuevos objetos y agregue color sin acceder a diferentes herramientas y paneles. Una, excluya, recorte y mucho más con rapidez.

9illustrator Graphix

Paso 5: Aplicamos una sombra a la figura con el comando Effect>Stylize>Drop Shadow y aplico los valores que se ven en la imagen

Paso 6: Creamos un círculo de 160 px x 160 px al cual le aplicamos un relleno 30R 115G 170B y contorno ninguno, posteriormente

centramos este círculo en la parte circular de la figura creada en las etapas anteriores tal como se ve en la figura.

Paso 7: Ahora crearemos dos círculos que serviran de brillos. El primero será de 115 px x 90 px y el segundo de 80 px x 45 px. Alinearemos estos círculos tal como se muestra en la figura.

10 illustrator Graphix

Paso 8: Seleccionamos el círculo que corresponde al brillo superior aplicamos un esfumado de dos pasos (blan-co a blanco), cambiamos el desplazamiento del esfumado seleccionando el rombo de la parte superior de la barra del esfumado en el panel Gradient e ingresando el valor de 70% en la casilla Location. Cambia-mos la orientación del esfuma-do a 90 grados y finalmente

hacemos doble click en el stop color izquierdo (el ícono que parece una casa debajo de la barra del esfumado) y en la casilla Opacity digitamos 0. La opacidad en los esfumados es una característica nueva de Illustrator CS5, si estás traba-jando con la versión CS3 o an-terior podrás simular el efecto con un Opacity Mask (Máscara de opacidad). Puedes ver el resultado en la figura.

Paso 9: Seleccionamos el círculo que corresponde al reflejo inferior y le aplicamos un relleno 255G 255B (Cyan), con-torno ninguno. Para desenfocar el círculo vamos al menú Effect>Blur>Gaussian Blur y aplicamos un radio de 15 px. Y ahí esta nuestro Botón, el cual le puedes poner el nombre que quieras.

Mejoras de dibujo: trabaje más rápido con las herramientas dia-rias. Dibuje por detrás, ignorando el orden de apilamiento. Dibuje o coloque una imagen dentro, creando de forma instantánea una máscara de recorte. Una trazados con una sola pulsación de tecla, vea los orígenes de la regla en la parte superior izquierda y escale los símbolos con un control de nueve sectores.

Gráficos nítidos para la Web y dispositivos móviles: cree objetos vectoriales de forma precisa en la cuadrícula de píxeles del archivo para obtener ilustracio-nes alineadas a nivel de píxel. Genere gráficos de trama nítidos y limpios mediante la activación de la función Alinear con cuadrícula de píxeles y mediante las opciones de suavizado para marcos de texto individuales.

Creando un botón Web

photoshop GraphixLas nuevas herramientas de Photoshop permiten crear ambientes y personajes con la ayuda de otros recursos para poder crear una composición natural

12 Photoshop Graphix

photoshop Graphix

Dando un aspecto lúgubre a tus fotosCon las nuevas herramientas de Photoshop, se puede crear una variendad de ambientes y luces, desde fotos e imagenes sin esa intención.

En este tutorial se muestra como trans-formar una foto con iluminación normal a una con lúgubre aspecto. Uno puede elegir una fotografía que sea de una habitación con aspecto abandonado,

se puede elegir alguna que se haya tomado o alguna de el siguiente link: www.abandonalia.blogspot.com.

13Photoshop Graphix

Dando un aspecto lúgubre a tus fotos

Paso 1.- lo que vamos a ocupar será oscurecerla. Para ello usaremos el short-cut CTRL + J para duplicar la capa. En el menú de capas, seleccionarmos como estilo de capa multiplicar.

Paso 2.- El primer paso que vamos a ocu-par será oscurecerla. Para ello usaremos el shortcut CTRL + J para duplicar la capa. En el menú de capas, seleccionarmos como estilo de capa multiplicar.

Como se puede apreciar en la imagen anterior, se puede ver más lúgubre. Para darle un aspecto más natural, se intercala otra capa con un color diferente (ajustando atributos de la imagen como tono y saturación) y un estilo de capa como es subexponer color o similar. Estas son sólo suge-rencias y dependerá de los gustos de cada persona así que no te limites, no hay norma alguna a seguir. Pero siempre recordando que lo que que-remos conseguir son sombras y luces tenues.

Paso 3.- Aquí se sugiere realizar el cambio de color a la capa principal y a la que esta en modo multiplicar seguido y entre medio de las dos otras capas con el color original en estilo color.

14 Photoshop Graphix

Y queda de la siguiente mane-ra con tonos más fríos que el original.

Paso 4.- Ahora lo que sigue es superponer todas las capas y colocando una capa total-mente negra a la que le ha dado estilo de saturación. A continuación se baja la opa-cidad al 55% para que que pierda coloración.

Paso 5.- Ahora, para modificar el colchón, que se sigue viendo aun muy claro, para esto con la herramienta de selección rápida lo selecciona y el short-cut CTRL + J hice una copia a la que también se le da un estilo de multiplicar. Y lo mismo se hace con la puerta del armario.

! A Decorar ¡

En este caso, una vela que ilumine la parte izquierda de la habitación y dos personas besándo-se encima del colchón.

Primero haremos la vela.

La vela la puedes en-contrar en algun sitio de internet o de su propia colección de imágenes. Puede que la aureola que aparezca alrededor si se encuentra encendida nos moleste, pero no importa, la podemos borrar o tam-bién con la herramienta de goma dándole una opacidad del 30% pode-mos ir borrando poco a poco hasta que quede de nuestro gusto.A la vela la copiaremos 3 veces poniendo a la copia superior subex-poner color, a la de en medio multiplicar y a la inferior normal. Con ello obtendremos una vela no tan brillante

La vela alumbrara una zona de la habitación así que lo que tendremos que hacer es pintarla no-sotros mismos. Elegimos un color similar al de la

Varita mágica:Es para hacer selecciones rá-pidas de áreas del mismo color. Pulsando en un lugar de la imagen nos selecciona todo el área que tiene el mismo color continuo.

15Photoshop Graphix

llama de la vela antes de aplicar los efectos sobre ella. Elegiremos el pincel y en él una brocha de las del segundo tipo, de las que tienen los bordes difuminados. Después, bajaremos la opacidad a un 30% y pintaremos en una capa nueva por donde creamos que habría luz.

Esta capa se situara de-bajo de la vela y debajo de la ultima capa del colchón para no ocultar todo con la luz.

Una vez creada la ilumi-nación, la copiaremos dos veces y pondremos una sobre el colchón que tenia el efecto de multi-plicar. A la capa superior le daremos el efecto de sobreexponer color (opa-cidad al 25%) y a la de en medio el de exclusión (opacidad al 5%). En esto como en todo podemos probar diferentes efecto a ver cual nos gusta más.

Después pondremos a la pareja en la cama. Para ello recortare-mos de la foto que queramos la pareja por el método que prefi-ramos. Luego la pegaremos debajo de la capa que en la imagen aparece nombrada como 8. Ahi repetiremos el proceso de copiando dos veces a la imagen y aplicando a la copia superior el efecto de multiplicar y al de en medio subexponer color, jugando si nos parece con la opacidad. Ahora haremos una cosa no muy complicada para no romper el orden de las capas y a la vez conseguir la misma iluminación que en el resto.

16 Photoshop Graphix

Para ello daremos click en la imagen de la capa que tenga a nuestra pareja manteniendo CTRL pulsan-do, con esto lo que conseguiremos será seleccionar solo esa zona. Luego daremos click (sin el ctrl.) enci-ma de la capa que contenga a una de las dos luces inferiores, sin perder la selección. Entonces copiare-mos con CTRL + J solo a la zona que se encuentra dentro de la selección. Repetiremos el proceso con la otra capa de iluminación, no así con la superior que ya se encuentra por encima de la pareja.

Ya casi tenemos la foto finalizada pero nos falta la sombra arrojada por la vela, para ello lo que haremos será hacer una copia de la pareja, a esta copia de la pareja la haremos

completamente negra mediante el menú de tono saturación que hemos usado antes. Luego disminuiremos la opacidad y la deforma-remos pulsando ctrl. +t. luego la situaremos en

donde queramos para que parezca la sombra.Y ya tendremos la ima-gen acabada.

17illustrator Graphix

flash GraphixNo se sabe si el Flash sustituirá al Html dentro del Internet, porque de todas formas Internet es una realidad en continua evolución y tarde o temprano aparecerá algún programa nuevo que podrá mejorar las funciones del Flash.

18 Flash Graphix

flash Graphix

Creando un galería webNo se sabe si el Flash sustituirá al Html dentro del Internet, porque de todas formas Internet es una realidad en continua evolución y tarde o temprano aparecerá algún programa nuevo que podrá mejorar las funciones del Flash, mientras que el Html de cualquier forma vendrá utilizada porque es la base de la tecnología utilizada para el Web.

Paso 1 .- Crear un documento Flash y poner las dimensiones y colores siguientes:

Paso 2.- Para este tutorial, se esta usando imágenes de 64 x 56 para las miniaturas y con la imagen principal de 320 x 280. Todas las imágenes usadas en este tutorial han sido descargadas desde la página sxh.cu gratis. Cada una ha sido cortada y resterizada a 320 x 280 para la imagen principal y 65 x 60 para las miniaturas. Lo segundo que vamos a crear es crear 2 folders en la librería, llamado imágenes y thumbs. Importe 8 miniaturas y 8 imáge-nes a los folders, preferentemente llamadas como se muestra a continuación.

Paso 3.- Después, sitúa “thumb-0”, “thumb-1” en la capa llamada “thumbs” y la imagen más grande en la capa llamada “gallery”.

19Flash Graphix

Paso 4.- Convertir cada una de las miniaturas en “Movie Clips”, dando-les click y presionando F8, moviéndolas a la posiciones mostradas a continuación. No tienes que convertir la imagen grande en un movie clip, porque vamos a adjuntar-las dinámicamente usando un “ActionScript” en unos momentos, Sólo sitúalas en las posiciones siguientes mostradas en la tercer imagen, para que se cree el fondo alrededor en el siguiente paso.

Paso 5.- Dar doble click en la herramienta de rectángulo, en la barra de herramientas y establecer un radio en las esquinas de 10.

Paso 6.- Crear un rectángulo azul oscúro en una capa inferior a las imágenes y después crear un rectángulo blanco en una capa inferior a esta.

Paso 7.- Da click en una imagen grande , convertirla en Movie Clip. Entrar a la imagen 1 “Image 0” y activar el campo de “Linkage”. “Image 0” debera aparecer bajo Identifier. Esto te permitirá adjuntar la imagen dinámi-camente con ActionScript. Una vez que se ha hecho esto, borrar el Movie Clip desde la estación y hacer lo mismo con la imagen-1, pero esta vez asignando a “image1” como el nombre del Movie Clip y “Identifier”. Después eliminar el Movie clip de la estación una vez que se haya hecho esto.

El Publish, que es un visualizador de nuestro trabajo ya sea en Html o en Flash. Y dependiendo de la orden que le demos, en este for-mato lo veremos, previo a nuestra edición final. Este se encuentra en Archivo. Otra forma de visualizar nuestro trabajo es por medio de Test Movie que se encuentra en Controles.

20 Flash Graphix

Paso 8.- Hacer lo mismo con el resto de las imágenes grandes, nombrán-dolas image2 - image1. Después convertir la miniatura en un Movie Clip llamado thumb0. No tienes que darle un Identifier o borrarlos de la estación, ya que no vamos a anexar dinámicamente con Actionscript.

Paso 9.- Hacer lo mismo con la siguientes miniaturas, cambiándoles el nombre.

Paso 10.- Crear un rectán-gulo con las dimensiones mostradas a continuación, y convertirlo en Movie Clip llamado Mask. Darle un Identifier llamado Mask, y después borrarlo, ya que se establecerá una máscara dinámica.

Paso 11.- En esta parte utilizarmos Actionscript, para esta creare-mos una nueva capa por encima de todas las otras que llamare-mos “Script”. Dar le click a esta y abrir el panel de acciones. Entrar a la primer línea del código y escribir lo siguiente.

21illustrator Graphix

dreamweaver GraphixEn la actualidad el contar con un sitio web se incrementa dia a dia. No solamente para aquellos que quieren ganar dinero en internet, sino para todas aquellas personas.

22 Dreamweaver Graphix

dreamweaver Graphix

Un sitio web es un conjunto de archivos y carpetas, re-lacionados entre sí, con un diseño similar o un objetivo común. Es necesario dise-ñar y planificar el sitio web antes de crear las páginas que va a contener.

La forma habitual de crear un sitio consiste en crear una carpeta en el disco lo-cal. Los documentos HTML normalmente se crean den-tro de dicha carpeta, mien-tras que para contener las imágenes, las animaciones, archivos de tipos especí-fico, etc., se deben crear nuevas carpetas dentro de ésta, con el objetivo de te-ner una mejor organización de los archivos a la hora de trabajar. Esto es lo que se conoce como sitio local.

Después se podrán copiar los archivos en un servidor web, en el denominado sitio remoto de modo que la gente podrá verlo en Internet.Por tanto, el sitio local y el sitio remoto tienen la misma estructura. El sitio local es la copia del sitio con la que

trabajaremos, y los cambios los actualizaremos en el sitio remoto.

La organización de los archivos en un sitio permite administrar y compartir archivos, mantener los vín-culos de forma automática, utilizar FTP para cargar el sitio local en el servidor, etc.

La página inicial de nuestro sitio debe de tener el nom-bre index.htm o index.html, ya que cuando se intenta acceder a una URL genéri-ca, el servidor devuelve la página con ese nombre.

Por ejemplo, si escribiéra-mos la dirección genérica http://www.google.com en el navegador, éste intenta-ría cargar la página http://www.google.com/index.htm, por lo que se produ-ciría un error en el caso de que no existiera ninguna página con el nombre index.htm, y no se podría navegar por el sitio a no ser que se escribiese exacta-mente http://www.google.com/nombrepagina.htm

Crear o editar un sitio web sin conexión a Internet Una vez creadas las carpe-tas que formarán la estruc-tura del sitio local, o por lo menos la carpeta raíz, ya es posible definir el nuevo sitio.Para ello hay que dirigirse al menú Sitio, a la opción Administrar sitios... o direc-tamente a Nuevo sitio. Recuerda que a través del panel Archivos, se puede cambiar a cada uno de los sitios definidos.

Configurando un sitio nuevoEn la actualidad el contar con un sitio web se incrementa dia a dia. No solamen-te para aquellos que quieren ganar dinero en internet, sino para todas aquellas personas que ya ofrecen algun serivicio o tienen algun negocio fisico

24 Dreamweaver Graphix

También podemos acceder desde el icono de acceso rápido de la barra de la apli-cación a la opción Adminis-trar sitios o Nuevo sitio...

Ver el sitio

El panel Archivos (menú Ventana > Archivos o tecla F8) es uno de los paneles más importantes de Dreamweaver, ya que nos da acceso a los archivo del sito. En este caso vemos todos los documentos creados en nuestro sitio buscar.htm, paraplantilla.htm, platossemana.htm, postresemana.htm y las carpetas imágenes y varios.

Es posible visualizar un sitio en el panel Archivos o en una ventana. Para cambiar de una vista a otra hay que pulsar sobre el botón que aparece en la parte superior del panel y de la ventana.

Esto nos sirve para ver a la vez el sitio local (el de nuestro equipo) y el sitio remoto (el del ser-vidor), y poder, por ejemplo, sincronizar los archivos, o compararlos. También el servidor de pruebas o las bases de datos.

En el caso de haber seleccionado la opción Administrar sitios, aparece una ventana que contiene la lista de sitios locales definidos con anterioridad.

Tanto si se elige la opción Nuevo..., como si se elige la opción Editar..., se mostrará la misma ventana en la que definir o modificar las características del sitio.

25Dreamweaver Graphix

Propiedades del documento Es conveniente definir sitios homogéneos, que todas las páginas de un sitio sigan un mismo formato, es decir, que tengan el mismo color de fondo, de fuente, etc.

Puede definirse el formato de cada una de las páginas a través del cuadro de diálogo

Propiedades de la página. Este cuadro se puede abrir de tres modos diferentes:

* Pulsar la combinación de teclas Ctrl + J. * Hacer clic sobre el menú Modificar y elegir la opción Propiedades de la página.

* Hacer clic con el botón derecho del ratón sobre el fondo de la página. Aparecerá al final del menú contextual la opción Propiedades de la página.

Se abrirá el cuadro de diálogo siguiente:

En la categoría Apariencia (CSS), como ves en la imagen anterior, encontramos las propiedades:Fuente de página: es el tipo de letra que le aplicaremos al texto.Tamaño: es el tamaño de la fuente que aplicaremos al texto.Color del texto: es el color de la fuente.Color del fondo: permite espe-cificar un color de fondo para el documento, pero dicho color solo se mostrará en el caso de no haber establecido ninguna imagen de fondo.

Imagen de fondo: permite es-pecificar una imagen de fondo para el documento. Dicha imagen se muestra en mosai-co. Es importante al elegir una imagen de fondo tener en cuenta que según los colores de la imagen será necesario establecer unos u otros colo-res para el texto, así como que no es conveniente tener un gif animado como fondo. Repetir: permite especificar si queremos que la imagen de fondo se repita o no. Si no queremos que se repita, selec-cionamos la opción no-repeat. Si queremos que se repita o

dejamos la opción en blanco o seleccionamos la opción repeat. Si queremos que se repita solo en horizontal selec-cionamos la opción repeat-x y si queremos que se repita en vertical, entonces selecciona-mos repeat-y. Márgenes: permiten estable-cer márgenes en el documen-to, es decir, la distancia entre donde empieza el contenido de la página y la ventana del navegador. En la categoría Apariencia (HTML), como vemos en la imagen siguiente, encontra-mos las propiedades:

26 Dreamweaver Graphix

Fuente de página: es el tipo de letra que le aplicaremos al texto.Tamaño: es el tamaño de la fuente que aplicaremos al texto.Color del texto: es el color de la fuente.Color del fondo: permite especificar un color de fondo para el documento, pero dicho color solo se mostrará en el caso de no haber establecido ninguna imagen de fondo.Imagen de fondo: permite especificar una imagen de fondo para el documento. Dicha imagen se muestra en mosaico. Es importante al elegir una imagen de fondo tener en cuenta que según los colores de la imagen será necesario establecer unos u otros colores para el texto, así como que no es conveniente tener un gif ani-

mado como fondo. Repetir: permite especificar si queremos que la imagen de fondo se repita o no. Si no queremos que se repita, selecciona-mos la opción no-repeat.

Vínculos activos: es el color que mostrará el vínculo cuando el cursor del ratón hace clic sobre el mismo.Márgenes: permiten establecer márgenes en el documento, es decir, la distancia entre donde empieza el contenido de la página y la ventana del navegador. En la categoría Vínculos (CSS) encontramos las propiedades:Podemos observar que muchas propiedades HTML y CSS son similares. La diferen-cia es que CSS aplica nuestra configuración utilizando reglas de estilo, mientras que HTML lo hace con atributos HTML. Estos últimos están cayendo en desuso, ya que se tiende a limitar el HTML al contenido, y no al diseño. Por eso, te desaconsejamos su uso.

27illustrator Graphix

28 illustrator Graphix

Graphix