diff options
-rw-r--r-- | index.xhtml | 27 | ||||
-rw-r--r-- | ztilo.css | 60 |
2 files changed, 74 insertions, 13 deletions
diff --git a/index.xhtml b/index.xhtml index 4470926..9863cbf 100644 --- a/index.xhtml +++ b/index.xhtml @@ -1,20 +1,18 @@ <?xml version="1.0" encoding="UTF-8" ?> -<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11-strict.dtd"> +<!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="en" lang="en"> <head> <!-- <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> --> <title>Hippie</title> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="author" content="Angie" /> - <link rel="stylesheet" type="text/css" href="/cannabis.css" /> + <link rel="stylesheet" type="text/css" href="/ztilo.css" /> </head> <body> - <aside> - <a href="/"> - <img src="rippie.jpg" alt="Hippie flag" title="I'm Hippie, yea" /></a> - </aside> + <noscript><p>Jabbazkreept no way!</p></noscript> + <p><img id="logo" src="rippie.jpg" alt="Hippie flag" title="I'm Hippie, yea" /></p> <h1>Angie's site</h1> - <div id="nav"> + <div id="sidebar"> <a href="hola">[link]</a> <a href="hola">[link]</a> <a href="hola">[link]</a> @@ -22,14 +20,17 @@ </div> <hr /> <hr /> + <div class="black"> <p> - Hola, me llamo Luke Skywalker y soy piloto - de una X-Wing en el Rogue Squadron. TambiƩn - soy un Jedi del Lado Luminoso de la Fuerza. - Mis maestros han sido Yoda y Obi-Wan Kenobi. + <em>Hey Jude</em> </p> - <iframe src="http://geekring.net" style="width: 20; height: 20; position: absolute;"> - </iframe> +<!-- <iframe id="left" src="Music" width="300" height="400"> + </iframe> --> + <p id="medida"> + hola + </p> + </div> + <br /> <hr /> </body> </html> diff --git a/ztilo.css b/ztilo.css new file mode 100644 index 0000000..53f5ce0 --- /dev/null +++ b/ztilo.css @@ -0,0 +1,60 @@ +body { + margin: auto; + padding-left: 1em; + padding-right: 1em; + max-width: 50em; + background-image: url("bgtrs.jpg"); + background-attachment: fixed; + color: #f3b2c1; +} + + + +#sidebar a { + background-color: black; + color: #f3b2c1; + text-decoration: underline double; +} + +#sidebar a:hover { + font-weight: bold; + color: #ff4b4b; + background-color: black; +} + +h1 { + background-color: black; + color: deeppink; +} + +#logo { + border: 3px solid black; + border-radius: 5px; + float: left; +} + +#left { + float: left; +} + +#right { + float: right; +} + +#medida { + text-align: right; + padding-right: 10px; +} + +#sidebar { + width: 300px; + padding: 10px; + float: left; +} + +.black { + background-color: black; + padding-left: 10px; + border: 1px solid white; + box-shadow: 4px 4px 0 white; +} |