init
This commit is contained in:
commit
794bf7faa4
|
|
@ -0,0 +1,79 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="HandheldFriendly" content="true">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
|
||||
<title>Bienvenido</title>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="monocol.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<article>
|
||||
<h1>Título </h1>
|
||||
|
||||
<div class="img-container">
|
||||
<!-- pon tu imagen aquí -->
|
||||
</div>
|
||||
|
||||
<h3>Menú</h3>
|
||||
<ul class="menu">
|
||||
<!-- Agrega tus páginas acá -->
|
||||
<li><a href="/">Inicio</a></li>
|
||||
<li><a href="#">Otra página</a></li>
|
||||
|
||||
</ul>
|
||||
|
||||
<h2>Quién soy</h2>
|
||||
<ul>
|
||||
<li>Usuario de texto-plano.xyz</li>
|
||||
<li>Me gusta BSD</li>
|
||||
<li>Me gusta la pizza</li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
<h2>Y esto qué es?</h2>
|
||||
|
||||
|
||||
<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
|
||||
|
||||
<h2>Header Level 2</h2>
|
||||
|
||||
<ol>
|
||||
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
|
||||
<li>Aliquam tincidunt mauris eu risus.</li>
|
||||
</ol>
|
||||
|
||||
<blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p></blockquote>
|
||||
|
||||
<h3>Header Level 3</h3>
|
||||
|
||||
<ul>
|
||||
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
|
||||
<li>Aliquam tincidunt mauris eu risus.</li>
|
||||
</ul>
|
||||
|
||||
<pre><code>
|
||||
#header h1 a {
|
||||
display: block;
|
||||
width: 300px;
|
||||
height: 80px;
|
||||
}
|
||||
</code></pre>
|
||||
|
||||
<hr>
|
||||
|
||||
Creado por ~ffuentes. Libre para reuso y modificaciones.
|
||||
|
||||
</article>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
/*
|
||||
Este archivo es liberado bajo las mismas condiciones de la licencia MIT.
|
||||
v. 0.01 monocol hoja de estilo 26-11-2020
|
||||
Francisco Fuentes (fuentes_f en encompasserve.org / correo en ffuent.es)
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-family: monospace;
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 700;
|
||||
line-height: 26.4px;
|
||||
text-decoration: underline
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: monospace;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-family: monospace;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 700;
|
||||
line-height: 15.4px;
|
||||
}
|
||||
|
||||
p, li {
|
||||
font-family: monospace;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-family: monospace;
|
||||
font-size: 21px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 400;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
pre {
|
||||
font-family: monospace;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 400;
|
||||
line-height: 18.5714px;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: monospace;
|
||||
background-color: #000000;
|
||||
color: #ffffff;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: 400;
|
||||
line-height: 18.5714px;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
|
||||
.img-container {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
ul.menu li{
|
||||
display:inline;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
/* For desktop: */
|
||||
article {
|
||||
word-wrap: break-word;
|
||||
width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
# Monocol
|
||||
|
||||
Una plantilla para crear páginas web con una estética mono columna y apariencia sencilla pero al mismo tiempo adaptativa para teléfonos móviles.
|
||||
No necesita javascript.
|
||||
|
||||
La idea es que tengan algo para utilizar como base para luego personalizarlo a su gusto.
|
||||
|
||||
## Registro de cambios
|
||||
|
||||
v 0.01 28-11-2020 Primera publicación
|
||||
|
||||
Loading…
Reference in New Issue