La propiedad Style whiteSpace en HTML DOM se usa para establecer el espacio en blanco para el contenido de texto. Devuelve la propiedad de espacio en blanco que se le da al texto.
Sintaxis:
- Devuelve la propiedad whiteSpace.
object.style.whiteSpace
- Se utiliza para establecer la propiedad whiteSpace.
object.style.whiteSpace = "normal|nowrap|pre|initial|inherit"
Valores de propiedad:
- normal: se usa para colapsar el espacio en blanco en un solo espacio en blanco y ajustar el texto. Es un valor predeterminado.
- nowrap: se utiliza para colapsar el espacio en blanco en un solo espacio en blanco y no hay ajuste de texto.
- pre: Se utiliza para definir el texto preformateado.
- pre-line: se utiliza para colapsar los espacios en blanco en un solo espacio en blanco y ajustar el texto en los frenos de línea.
- pre-wrap: se utiliza para conservar los espacios en blanco y ajustar el texto en los frenos de línea.
- initial: establece la propiedad whiteSpace en su valor predeterminado.
- heredar: esta propiedad se hereda de su elemento padre.
Valor de retorno: Devuelve una string que representa la propiedad WhiteSpace para un elemento.
Ejemplo 1:
HTML
<!DOCTYPE html>
<html>
<head>
<title>
DOM Style whiteSpace Property
</title>
</head>
<body>
<center>
<h1 style = "color:green;">
GeeksForGeeks
</h1>
<h2>
DOM Style whiteSpace Property
</h2>
<p id = "gfg">
A Computer science portal for geeks
A Computer science portal for geeks
</p>
<button type = "button" onclick = "geeks()">
Change
</button>
<script>
function geeks() {
document.getElementById("gfg").style.whiteSpace
= "pre-line";
}
</script>
</center>
</body>
</html>
Salida:
Antes Haga clic en el botón:
Después de hacer clic en el botón:
Ejemplo 2:
HTML
<!DOCTYPE html>
<html>
<head>
<title>
DOM Style whiteSpace Property
</title>
</head>
<body>
<center>
<h1 style = "color:green;">
GeeksForGeeks
</h1>
<h2>
DOM Style whiteSpace Property
</h2>
<p id = "gfg">A Computer science portal for geeks
A Computer science portal for geeks
</p>
<button type = "button" onclick = "geeks()">
Change
</button>
<script>
function geeks() {
document.getElementById("gfg").style.whiteSpace
= "pre-wrap";
}
</script>
</center>
</body>
</html>
Salida:
Antes Haga clic en el botón:
Después de hacer clic en el botón:
Navegadores compatibles: los navegadores compatibles con la propiedad DOM Style whiteSpace se enumeran a continuación:
- Google Chrome 1 y superior
- Borde 12 y superior
- Firefox 1 y superior
- Internet Explorer 5.5 y superior
- Ópera 4 y superior
- Safari 1 y superior
Publicación traducida automáticamente
Artículo escrito por bestharadhakrishna y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA