JSFiddle - React, Tailwind, and code Playground

by kiokotzu

HTML

<h1>Lorem ipsum dolor sit amet</h1>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. At esse magnam fugiat quam quia aliquid doloribus repellendus alias sint rem ipsa quasi mollitia ipsam deleniti officiis fugit iusto eligendi tempore?</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis sequi culpa voluptatum eligendi minus dolor totam. Recusandae maiores rem fugiat neque sint provident non consequatur illum minus quisquam quo vel!</p>
<button id="font-8">tamaño 8px</button>
<button id="font-16">tamaño 16px</button>
<button id="font-20">tamaño 20px</button>

CSS

body{font-size:14px}
h1{font-size:2.5em}
div{font-size:1.8em}
p{font-size:1.5em}

JavaScript

/*--------ajusta el tamaño del texto en la página-----*/
function tamanio(font){
    return function(){
        document.body.style.fontSize = font + 'px';
    }
}

var font8 = tamanio(8);
var font16 = tamanio(16);
var font20 = tamanio(20);

document.getElementById('font-8').onclick = font8;
document.getElementById('font-16').onclick = font16;
document.getElementById('font-20').onclick = font20;