1

Temat: kolor + style + rozmiar

<script>
    function ustaw()
    {
        var tekst = document.getElementById('tekst');
        var r = document.getElementById('r');
        var g = document.getElementById('g');
        var b = document.getElementById('b');
        var kursywa = document.getElementById('kursywa');
        var pogrubienie = document.getElementById('pogrubienie');
        var rozmiar = document.getElementById('rozmiar');
        //
        tekst.style.color = "rgb("+r.value+", "+g.value+", "+b.value+")";
        //
        if (kursywa.checked) tekst.style.fontStyle = 'italic';
        else tekst.style.fontStyle = 'normal';
        if (pogrubienie.checked) tekst.style.fontWeight = 'bold';
        else tekst.style.fontWeight = 'normal';
        //
        tekst.style.fontSize = rozmiar.value + '%';
    }       
</script>
<form>
  Kolor
  r: <input type="number" id="r" value="50" onchange="ustaw()">
  g: <input type="number" id="g" value="50" onchange="ustaw()">
  b: <input type="number" id="b" value="50" onchange="ustaw()"><br>
  <input type="checkbox" id="kursywa" onchange="ustaw()"> Ustawia kursywę
  <input type="checkbox" id="pogrubienie" onchange="ustaw()"> Ustawia pogrubienie<br>
  Rozmiar <input type="number" id="rozmiar" value="50" onchange="ustaw()"> w %<br>
  <input type="button" value="Ustaw" onclick="ustaw()">
</form>
<hr>
<span id="tekst">Ala ma kota</span>