EN · DE · RU · FR · ES

#4050: index.html

site/_sass/system-font-css/index.html Tipo: Plantilla HTML · Fuente: site/_sass/system-font-css/index.html 189 líneas · 154 código · 0 comentarios · 35 en blanco
Plantilla HTML Wicket para la aplicación ProjectForge.

Contenido

<!doctype html>
<title>System Font CSS</title>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="system-font.css" rel="stylesheet">
<style>
@font-face {
	font-family: monospace;
	font-style: normal;
	font-weight: 400;
	src: local("Menlo-Regular"), local("Monaco"), local("Consolas"), local("DejaVu Sans Mono"), local("DejaVu Sans Mono");
}

@font-face {
	font-family: monospace;
	font-style: italic;
	font-weight: 400;
	src: local("Menlo-Regular"), local("Monaco"), local("Consolas-Italic"), local("DejaVu Sans Mono Oblique");
}

@font-face {
	font-family: monospace;
	font-style: normal;
	font-weight: 700;
	src: local("Menlo-Regular"), local("Monaco"), local("Consolas-Bold"), local("DejaVu Sans Mono Bold");
}

@font-face {
	font-family: monospace;
	font-style: italic;
	font-weight: 700;
	src: local("Menlo-Regular"), local("Monaco"), local("Consolas-BoldItalic"), local("DejaVu Sans Mono Bold Oblique");
}

body {
	font: 1em/1.6 system-ui, Tahoma, sans-serif;
	margin: 3em auto;
	max-width: 40em;
}

@media (max-width: 42em) {
	body {
		margin: 3em 1em;
	}
}

h1,
h2 {
	border-bottom: 1px solid #eee;
	padding-bottom: .3em;
}

h1 {
	margin: 1em 0 1rem;
	font-size: 2.25em;
}

h2 {
	font-size: 1.75em;
	line-height: 1.225;
	margin: 1em 0 1rem;
}

code,
pre {
	border-radius: 3px;
	font-family: "monospace", monospace;
	font-size: 85%;
}

p,
pre {
	margin: 0 0 1em;
}

code {
	background-color: rgba(0,0,0,.04);
	padding: .2em;
}

pre {
	background-color: #f7f7f7;
	line-height: 1.45;
	padding: 1em;
	-moz-tab-size: 4;
	tab-size: 4;
}

a {
	color: #4078c0;
	text-decoration: none;
}

a:focus,
a:hover {
	text-decoration: underline;
}

.token-selector {
	color: #0A0;
}

.token-property-name {
	color: #44B;
}

.token-property-value {
	color: #B50;
}
</style>

<h1>
	System Font CSS
</h1>

<p>
	System Font CSS es un conjunto de reglas <code>@font-face</code> que te permiten usar la fuente nativa del sistema del sistema operativo que ejecuta el navegador.
</p>

<pre>
<span class="token-selector">body</span> {
    <span class="token-property-name">font-family</span>: <span class="token-property-value">system</span>;
}
</pre>

<p>
	<a href="https://github.com/jonathantneal/system-font-css">system-font.css</a> ofrece ocho variaciones de la familia de fuentes <code>system</code>; <strong>light</strong> (300) <strong>light italic</strong>, <strong>normal</strong> (400), <strong>normal italic</strong>, <strong>medium</strong> 

Historial Git

ac75fabf3 Páginas de Github migradas a Asciidoc (se requieren acciones de Github).