Bueno. Ya hemos creado apropiadamente el logo en HTML. Ahora lo que tenemos que hacer es darle forma y qué mejor manera de hacerlo que en CSS. Antes que nada sin embargo, crearé un documento XHTML completo a partir del que creamos en el tutorial anterior.
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es"> <head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" /> <title>Logotipo de EstiloCSS.com</title> </head> <body> <div class="logo vcard"> <h1><a class="fn org url" href="http://www.estilocss.com" title="Haga click aquí para ir a la página principal. Tecla de accesso:H" accesskey="h"><span class="mainWord">Estilo</span><span class="css1">CS</span><span class="css2">S</span><span class="slogan">Tutoriales de CSS</span></a><span class="email">contacto@estilocss.com</span></h1> </div> </body> </html>
Perfecto. Ahora para agregarle el CSS al XHTML he creado el archivo ‘logo.css’ dentro de una carpeta llamada ‘CSS’ ubicada en el mismo lugar donde he creado mi archivo XHTML. Ahora es solo cuestión de agregar el vínculo apropiado por medio de la etiqueta <link> dentro de <head>.