Objetivos

En este ejercicio usaremos la instrucción css() para redimensionar el texto de la página Web.

Instrucciones

Copia el código provisto en un fichero "redimensionar.html"
Visualiza el efecto

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="jquery-3.5.1.js"></script>
    <title>Document</title>
    <style>
        p {
            font-size: 1em;
        }
    </style>
</head>

<body>
    <input type="button" value="Más grande" id="mas">
    <input type="button" value="Más pequeño" id="menos">
    <p>Lorem ipsum dolor sit amet, magna adipiscing elit. Quisque at
        cursus est. Phasellus id ligula massa. Quisque id lacus mauris.
        Suspendisse vehicula tortor eu magna.</p>

    <script>
        $(document).ready(function () {
            $('input').click(function () {
                var texto = $('p');
                var tamaño = texto.css('fontSize');
                var numero = parseFloat(tamaño, 10);
                var unidad = tamaño.slice(-2);
                if (this.id == 'mas') {
                    numero *= 1.2;
                }
                else if (this.id == 'menos') {
                    numero /= 1.2;
                }
                texto.css('fontSize', numero + unidad);
            });
        });
    </script>
</body>

</html>