SdeBatman/dabblet.css

## dabblet.css
/**
 * The first commented line is your dabblet’s title
 */
body{color: black}
h2 {color: black}
p {text-aling:rigt
font-family:"Times New Roman";
font-size:12px;}


header {
min-height: 98%;
background: #FFFFCC;}
nav{
background:purple;
min-height: 100%;}

section {
background: #FFFFCC;
background: linear-gradient(23deg, green, yellow, blue);
float: left;
width: 70%;
min-height:80%;}

article {
background: linear-gradient(01deg, #CCCCFF, yellow);
width:98%;
float: right}

aside{
background: black;
float:left
width: 18%;}
footer {
width:23%;
background-colour: #333;
float:center;
}
header, section, footer, aside, article, nav
{margin: 1%;}

## dabblet.html
<!DOCTYPE html>


<head>
<title>Titulo de la web</title>
<meta charset="utf-8" />
</head>

<body>
    <header>
       <h1>Mi sitio web</h1>
       <p>The entertainment system was belting out the Beatles' "We Can Work It Out" when the phone rang.
When Pete answered, his phone turned the sound down by sending a message to all the other local
devices that had a volume control. His sister, Lucy, was on the line from the doctor's office: "Mom needs
to see a specialist and then has to have a series of physical therapy sessions. Biweekly or something. I'm
going to have my agent set up the appointments." Pete immediately agreed to share the chauffeuring.
At the doctor's office, Lucy instructed her Semantic Web agent through her
handheld Web browser. The agent promptly retrieved information about
Mom's prescribed treatment from the doctor's agent, looked up several lists of
providers, and checked for the ones in-plan for Mom's insurance within a
20-mile radius of her home and with a rating of excellent or very good on
trusted rating services. It then began trying to find a match between available
appointment times (supplied by the agents of individual providers through
their Web sites) and Pete's and Lucy's busy schedules. (The emphasized
keywords indicate terms whose semantics, or meaning, were defined for t</p>

    </header>
    <section>
       <article>
           <h2>cosa 1<h2>
           <p> Contenido (ademas de imagenes, citas, videos etc.)
           Comunidad de usuarios que comparten rutas y puntos de interés GPS. Descubre, publica y comparte rutas y puntos de interés GPS del Mundo. </p>
       </article>
       <article>
           <h2>cosa 2<h2>
          <p> <img src="http://www.ojodigital.com/foro/attachments/fotos-con-historia/13049d1196241197-fotos-con-historia-19-28-11-07-steve-mccurry-afghan-girl-0015slz1.jpg" widht="250" height="300"></article>
       </article>
    </section>
    <aside>
       <h3>Titulo de contenido</h3>
           <p>contenido
           Utilice el bloc de notas para crear un documento HTML5.
Debe introducir una definición y una abreviatura.
Àrea de Coneixement de Biblioteconomia i Documentació
Universitat Pompeu Fabra
mari.vallez@upf.edu


</p>
    </aside>
    <footer>
        Creado por mi el 2011
    </footer>
</body>
</html><!-- content to be placed inside <body>…</body> -->

## dabblet.js
// alert('Hello world!');

## settings.json
{"view":"split","fontsize":"90","seethrough":"","prefixfree":"1","page":"css"}
	/**
	* The first commented line is your dabblet’s title
	*/
	body{color: black}
	h2 {color: black}
	p {text-aling:rigt
	font-family:"Times New Roman";
	font-size:12px;}


	header {
	min-height: 98%;
	background: #FFFFCC;}
	nav{
	background:purple;
	min-height: 100%;}

	section {
	background: #FFFFCC;
	background: linear-gradient(23deg, green, yellow, blue);
	float: left;
	width: 70%;
	min-height:80%;}

	article {
	background: linear-gradient(01deg, #CCCCFF, yellow);
	width:98%;
	float: right}

	aside{
	background: black;
	float:left
	width: 18%;}
	footer {
	width:23%;
	background-colour: #333;
	float:center;
	}
	header, section, footer, aside, article, nav
	{margin: 1%;}
	<!DOCTYPE html>


	<head>
	<title>Titulo de la web</title>
	<meta charset="utf-8" />
	</head>

	<body>
	<header>
	<h1>Mi sitio web</h1>
	<p>The entertainment system was belting out the Beatles' "We Can Work It Out" when the phone rang.
	When Pete answered, his phone turned the sound down by sending a message to all the other local
	devices that had a volume control. His sister, Lucy, was on the line from the doctor's office: "Mom needs
	to see a specialist and then has to have a series of physical therapy sessions. Biweekly or something. I'm
	going to have my agent set up the appointments." Pete immediately agreed to share the chauffeuring.
	At the doctor's office, Lucy instructed her Semantic Web agent through her
	handheld Web browser. The agent promptly retrieved information about
	Mom's prescribed treatment from the doctor's agent, looked up several lists of
	providers, and checked for the ones in-plan for Mom's insurance within a
	20-mile radius of her home and with a rating of excellent or very good on
	trusted rating services. It then began trying to find a match between available
	appointment times (supplied by the agents of individual providers through
	their Web sites) and Pete's and Lucy's busy schedules. (The emphasized
	keywords indicate terms whose semantics, or meaning, were defined for t</p>

	</header>
	<section>
	<article>
	<h2>cosa 1<h2>
	<p> Contenido (ademas de imagenes, citas, videos etc.)
	Comunidad de usuarios que comparten rutas y puntos de interés GPS. Descubre, publica y comparte rutas y puntos de interés GPS del Mundo. </p>
	</article>
	<article>
	<h2>cosa 2<h2>
	<p> <img src="http://www.ojodigital.com/foro/attachments/fotos-con-historia/13049d1196241197-fotos-con-historia-19-28-11-07-steve-mccurry-afghan-girl-0015slz1.jpg" widht="250" height="300"></article>
	</article>
	</section>
	<aside>
	<h3>Titulo de contenido</h3>
	<p>contenido
	Utilice el bloc de notas para crear un documento HTML5.
	Debe introducir una definición y una abreviatura.
	Àrea de Coneixement de Biblioteconomia i Documentació
	Universitat Pompeu Fabra
	mari.vallez@upf.edu


	</p>
	</aside>
	<footer>
	Creado por mi el 2011
	</footer>
	</body>
	</html><!-- content to be placed inside <body>…</body> -->