La propiedad font-variant se usa para convertir todas las letras minúsculas en letras mayúsculas. Pero las letras mayúsculas convertidas parecen tener un tamaño de fuente demasiado pequeño que las letras mayúsculas originales.
Sintaxis:
font-variant: normal|small-caps|initial;
Valor por defecto:
- normal
Valores de propiedad
normal: Tiene un valor por defecto. Especifica un tamaño de fuente normal.
Sintaxis:
font-variant:normal;
Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color: green;
}
p.geeks {
font-variant: normal;
}
</style>
</head>
<body>
<center>
<h1>GeeksForGeeks</h1>
<h2>font-variant:normal;</h2>
<p class="geeks">GeeksForGeeks.</p>
<p>It is a computer science portal for geeks.</p>
</body>
</html>
Producción :
small-caps: Se utiliza para convertir todas las letras minúsculas en letras mayúsculas.
Sintaxis:
font-variant:small-caps;
Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color: green;
}
p.geeks {
font-variant: small-caps;
}
.gfg {
font-variant: small-caps;
}
</style>
</head>
<body>
<center>
<h1>GeeksForGeeks</h1>
<h2>font-variant:small-caps;</h2>
<p class="geeks">GeeksForGeeks.</p>
<p class="gfg">
It is a computer science
portal for geeks.
</p>
</body>
</html>
Producción:
initial: Establece la propiedad a su valor por defecto.
Sintaxis:
font-variant:initial;
Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color: green;
}
p.geeks {
font-variant: initial;
}
.gfg {
font-variant: initial;
}
</style>
</head>
<body>
<center>
<h1>GeeksForGeeks</h1>
<h2>font-variant:initial;</h2>
<p class="geeks">GeeksForGeeks.</p>
<p class="gfg">
It is a computer science
portal for geeks.
</p>
</body>
</html>
Producción:
Navegadores compatibles: los navegadores compatibles con la propiedad CSS font-variant se enumeran a continuación:
- Google Chrome 1.0
- Internet Explorer 4.0
- Firefox 1.0
- Ópera 3.5
- Apple Safari 1.0
Publicación traducida automáticamente
Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA