En este artículo, veremos cómo cambiar la alineación del texto de un elemento usando jQuery. Para cambiar la alineación del texto de un elemento, usamos el método css().
El método css() se usa para cambiar la propiedad de estilo del elemento seleccionado.
Sintaxis:
$(selector).css(property)
En el siguiente ejemplo, primero, creamos un elemento <h3> que contiene un atributo de identificación y también creamos un elemento de botón. Cuando el usuario hace clic en el botón, se llama al método css() y este método establece el valor de la propiedad de alineación de texto en el centro.
Ejemplo:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content=
"width=device-width, initial-scale=1.0">
<!-- Including jQuery -->
<script src="
https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>
How to change the text
alignment using jQuery ?
</h3>
<h3 id="content">
Welcome to GeeksforGeeks
</h3>
<br>
<button>Change font size</button>
<script>
$(document).ready(function() {
$('button').click(function() {
$("#content").css("textAlign", "center");
});
});
</script>
</body>
</html>
Producción:
