Skip to content

Instantly share code, notes, and snippets.

@bertobox
Forked from anonymous/dabblet.css
Created September 3, 2013 17:15
Show Gist options
  • Save bertobox/6426752 to your computer and use it in GitHub Desktop.
Save bertobox/6426752 to your computer and use it in GitHub Desktop.
Cajas de texto
/**
* Cajas de texto
* En esta sección, van los selectores y propiedades CSS
* @author Robert Valencia <http://robertvalencia.com>
*/
/** Reset de CSS
* Por lo general hay ciertas reglas de CSS que usamos
* para ‘resetear’ algunos valores y así tener un punto
* de partida más apropiado a nuestras necesidades.
*/
body{margin:0;padding:0;}
/* Propiedades para el elemento `body` */
body{ background-color:gray; }
/*
* Propiedades para la caja verde,
* la cual es un `div` con un atributo de clases `verde-limon` y `caja`
*
* las siguientes son formas de declarar el fondo verde
* al mismo elemento div:
*
* div{ background-color:limegreen;}
* .verde-limon{ background-color:limegreen;}
*/
div{background-color:red;}
/*
* Propiedades para la clase `caja`
* aplica un margen interno de un cuadratín,
* un ancho máximo de 50% y lo centra en la ventana.
*/
.caja{
padding:1em;
width:50%;
margin:5em auto;
}
/* Propiedades para el versículo */
.versiculo { color: red ; text-align:center;font-family:Georgia,serif;font-size:23px;line-height:160%;}
#verso-1{color:gray;}
#verso-2{color:rgba(23,29,59,1);}
/*
* Propiedades para el elemento `cite`,
* alineándolo a la derecha y con un tamaño más pequeño.
*/
cite{text-align:right;display:block;font-size:.67em;}
/* Propiedades para el elemento de derechos */
.derechos{position:absolute;bottom:10px;padding:.5em 0 0 10px;border-top:1px dotted #555;width:100%;}
<div class="caja verde-limon">
<p id="verso-1" class="versiculo">
Todo lo puedo en Cristo que me fortalece
<cite>—Filipenses 4:13</cite>
</p>
</div>
<div class="caja rosita">
<p id="verso-2" class="versiculo">
Jesús lloró.
<cite>—Juan 11:35</cite>
</p>
</div>
<p class="derechos">Copyright ©2013 Roberto Valencia</p>
// alert('Hello world!');
{"view":"split-vertical","fontsize":"140","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment