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>