Tablilla en html {codigo basico}

Código:

<div style="Propiedades">

<div style="Propiedades">Nombre</div>
<img src="Link" style="Propiedades" />
<div style="Propiedades">Datos básicos</div>

<div style="Propiedades">Descripción</div>
<div style="Propiedades"><div style="Propiedades"> Texto aqui </div></div>

<div style="Propiedades"> Credito </div>

</div>

Nombre Del Personaje

Datos básicos

Descripción

Texto aqui

Credito

width: 400px; /*** Ancho del cuadro ***/
padding: 10px; /*** Lo que se separa el contenido del borde ***/
margin: 0 auto; /*** Esto sirve para que la tabla aparezca centrada. ***/
background-color: #F2E9E1; /*** Color de fondo. ***/
border: double 6px #CBE86B; /*** Borde ***/

text-align: center; /*** Texto centrado ***/
font-size: 36px; /*** Tamaño de texto ***/
font-family: Yanone Kaffeesatz; /*** Fuente escogida. Si ponéis una fuente personalizada hay que incluirla en la tablilla. Si no sabéis como, tenéis este tutorial. ***/
color: #1C140D; /*** Color de texto ***/
text-transform:uppercase; /*** Hace que todas las letras se conviertan en mayusculas ***/
letter-spacing: 2px; /*** Separación entre las letras ***/
padding-bottom:10px; /*** Separación entre el texto y lo que irá debajo ***/

width: 394px; /*** Ancho ***/
height: 150px; /*** Alto ***/
border-style: solid dashed; /*** Estilo de borde. La primera palabra es para los bordes de "arriba y abajo" y la segunda para los de la "derecha e izquierda ***/
border-width: 3px; /*** Ancho de borde ***/
border-color: #CBE86B; /*** Color de borde ***/

background: #CBE86B;
color: #1C140D;
font-size: 10px;
text-align: center;
letter-spacing: 2px;
font-family: tahoma;
text-transform: lowercase;
padding: 2px;

max-height: 250px; /*** Es necesario establecer una altura máxima para poner un scroll ***/
padding:5px;
overflow: auto; /*** Esto hará que salga la barra de scroll ***/
opacity: 0.8; /*** Me gusta ponerle transparencia a los cuadros que tienen scroll para que la barra destaque menos, tu puedes quitarselo. ***/