La propiedad fontVariant de estilo en DOM HTML se usa para establecer la fuente en letras mayúsculas. Esta propiedad convierte principalmente letras minúsculas a mayúsculas, pero las letras tienen un tamaño de fuente pequeño en comparación con el resto del texto.
Sintaxis:
- Devuelve la propiedad fontVariant.
object.style.fontVariant
- Solía establecer la propiedad fontVariant.
object.style.fontVariant = "normal|small-caps|initial|inherit"
Valores:
| Valor | Descripción |
|---|---|
| normal | Valor predeterminado con texto normal. |
| letras minúsculas | Fuente en minúsculas |
| inicial | Establecer en el valor predeterminado |
| heredar | Heredar propiedad del elemento principal |
Valor devuelto:
- Devuelve una string que representa una fuente en minúsculas.
Ejemplo 1:
<!DOCTYPE html>
<html>
<head>
<title>DOM Style fontVariant Property </title>
</head>
<body>
<center>
<h1 style="color:green;width:40%;">
GeeksForGeeks
</h1>
<h2>DOM Style fontVariant Property </h2>
<p id="gfg">
A computer science portal for geeks
</p>
<button type="button" onclick="geeks()">
Submit
</button>
<script>
function geeks() {
// Set fontVariant
document.getElementById(
"gfg").style.fontVariant =
"small-caps";
}
</script>
</center>
</body>
</html>
Producción:
Antes de hacer clic en el botón:
Después de hacer clic en el botón:
Ejemplo-2:
<!DOCTYPE html>
<html>
<head>
<title>DOM Style fontVariant Property </title>
</head>
<body>
<center>
<h1 style="color:green;width:40%;">
GeeksForGeeks
</h1>
<h2>DOM Style fontVariant Property </h2>
<p id="gfg">
A computer science portal for geeks
</p>
<button type="button" onclick="geeks()">
Submit
</button>
<script>
function geeks() {
// Set fontVariant
document.getElementById(
"gfg").style.fontVariant =
"all-small-caps";
}
</script>
</center>
</body>
</html>
Producción:
Antes de hacer clic en el botón:
Después de hacer clic en el botón:
Navegadores compatibles: los navegadores compatibles con la propiedad DOM Style fontVariant se enumeran a continuación:
- Google Chrome
- explorador de Internet
- Firefox
- Ópera
- safari de manzana
Publicación traducida automáticamente
Artículo escrito por bestharadhakrishna y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA