From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- files/es/web/css/font-weight/index.html | 181 ++++++++++++++++++++++++++++++++ 1 file changed, 181 insertions(+) create mode 100644 files/es/web/css/font-weight/index.html (limited to 'files/es/web/css/font-weight') diff --git a/files/es/web/css/font-weight/index.html b/files/es/web/css/font-weight/index.html new file mode 100644 index 0000000000..747efcfd61 --- /dev/null +++ b/files/es/web/css/font-weight/index.html @@ -0,0 +1,181 @@ +--- +title: font-weight +slug: Web/CSS/font-weight +tags: + - CSS + - Propiedad de CSS + - Referencia + - Tipos de letra de CSS +translation_of: Web/CSS/font-weight +--- +
{{CSSRef}}
+ +

Resumen

+ +

La propiedad font-weight de CSS especifica el peso o grueso de la letra. Algunos tipos de letra sólo están disponibles en normal y bold.

+ +

{{cssinfo}}

+ +

Sintaxis

+ +
font-weight: normal;
+font-weight: bold;
+
+/* Relativo al padre */
+font-weight: lighter;
+font-weight: bolder;
+
+font-weight: 100;
+font-weight: 200;
+font-weight: 300;
+font-weight: 400;
+font-weight: 500;
+font-weight: 600;
+font-weight: 700;
+font-weight: 800;
+font-weight: 900;
+
+/* Valores globales */
+font-weight: inherit;
+font-weight: initial;
+font-weight: unset;
+
+ +

Valores

+ +
+
normal 
+
Peso/grueso normal de la fuente. Igual que 400.
+
bold 
+
Grueso ancho (negrita). Igual que 700.
+
lighter 
+
Corresponde a un tipo de fuente menos grueso que el tipo del elemento padre (dentro de los valores disponibles).
+
bolder 
+
Corresponde a un tipo de fuente más grueso que el tipo del elemento padre (dentro de los valores disponibles).
+
100, 200, 300, 400, 500, 600, 700, 800, 900 
+
Pesos numéricos para los tipos de fuente que nos permiten más flexibilidad que normal - bold. Si el peso especificado no existe en el tipo de fuente escogido, un valor entre 600 y 900 se presentará con el valor más próximo disponible para dar una letra más oscura. De igual forma, un valor entre 100 y 500 se presentará con el valor más próximo disponible para dar una letra más clara. Esto significa que para los tipos de letra que sólo dispongan de normal y bold, cualquier valor entre 100 y 500 será normal y entre 600 y 900, será bold.
+
+ +

Ejemplos

+ +

HTML

+ +
<p>
+  Alice was beginning to get very tired of sitting by her sister on the
+  bank, and of having nothing to do: once or twice she had peeped into the
+  book her sister was reading, but it had no pictures or conversations in
+  it, 'and what is the use of a book,' thought Alice 'without pictures or
+  conversations?'
+</p>
+
+<div>I'm heavy<br/>
+  <span>I'm lighter</span>
+</div>
+
+ +

CSS

+ +
/* Poner texto del párrafo en negrita. */
+p {
+  font-weight: bold;
+}
+
+/* Poner texto del div a dos pasos más oscuro que lo
+   normal pero menos que una negrita estándar. */
+div {
+ font-weight: 600;
+}
+
+/* Sets text enclosed within span tag
+   to be one step lighter than the parent. */
+span {
+  font-weight: lighter;
+}
+ +

Resultado

+ +

{{EmbedLiveSample("Examples","400","300")}}

+ +

Especificaciones

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EspecificaciónEstadoComentario
{{SpecName('CSS3 Fonts', '#font-weight-prop', 'font-weight')}}{{Spec2('CSS3 Fonts')}}Sin cambio
{{SpecName('CSS3 Transitions', '#animatable-css', 'font-weight')}}{{Spec2('CSS3 Transitions')}}Define font-weight como animable.
{{SpecName('CSS2.1', 'fonts.html#propdef-font-weight', 'font-weight')}}{{Spec2('CSS2.1')}}Sin cambio
{{SpecName('CSS1', '#font-weight', 'font-weight')}}{{Spec2('CSS1')}}Definición inicial
+ +

Compatibilidad entre navegadores

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
CaracterísticaChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Apoyo básico2.0{{CompatGeckoDesktop(1.0)}}3.03.51.3
+
+ +
+ + + + + + + + + + + + + + + + + + + +
CaracterísticaAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Apoyo básico1.0{{CompatGeckoMobile(1.0)}}6.06.03.1
+
-- cgit v1.2.3-54-g00ecf