abc HTML5 i CSS TUTORIAL

Dodatak: Radio dugme /APPENDIX: RADIO BUTTON/

Radio dugme koristi se za izbor jedne od ponudjenih mogućnosti.


Slika 1. Tip TAG-a

<form></form> fefiniše formu
<input> kreira red za unos
<select></select> kreira polje za selkciju
<option> </option> kreira element liste

Samo jedna od mogućnosti može biti trenutno aktivna.

Muski
Zenski

Slika 2. Primjer Dva radio dugmeta
 

Primjer 1. Kreirati HTML kod za formiranje radio dugmadi za izbor godina starosti.

<html>
<head>
<title>RADIO BUTTON</title>
</head>
<body>
<form>
<p>Izaberite godine:</p>
<input type="radio" name="godine" value="30">0 - 30<br>
<input type="radio" name="godine" value="60">31 - 60<br>
<input type="radio" name="godine" value="90">61 - 100<br>
</form>
</body>
</html>

Izaberite godine:

0 - 30
31 - 60
61 - 100
   

Primjer 2. Kreirati HTML kod za formiranje radio dugmadi za izbor vašeg omiljenog sporta

<html>
<head>
<title>RADIO BUTTON</title>
</head>
<body>
<form>
<p>Izaberite sport:</p>
<input type="radio" name="sport" value="noga">Fudbal<br>
<input type="radio" name="sport" value="kos">Košarka<br>
<input type="radio" name="sport" value="mreza">Odbojka<br>
<input type="radio" name="sport" value="ruka">Rukomet<br>
</form>
</body>
</html>

Izaberite sport:

Fudbal
Košarka
Odbojka
Rukomet
   

Primjer 4. Kreirati HTML kod za formiranje radio dugmadi za izbor pola (muški i ženski).

<html>
<head>
<title>RADIO BUTTON</title>
</head>
<body>
<form>
<p>Izaberite pol:</p>
<input type="radio" name="pol" value="muski">Muski<br>
<input type="radio" name="pol" value="zenski">Zenski<br>
</form>
</body>
</html>

Izaberite pol:

Muski
Zenski
 

Prozor na dnu stranice je namjenje za provjeru koda:
- kopirajte kod (edit, copy, paste ili CTRL+C, CTRL+V ili DRAG&DROP metodom), editovanje je moguće u prozoru

Index