pertemuan 24

VIORIZA-XIRPL1

Assalamualaikum wr.wb

tanggwarna.html

<!DOCTYPE html> <html> <head> <title>Tangga Berwana</title> </head> <style type="text/css"> body { font-family: arial; } h1 { text-transform: uppercase; } label{ width: 15%; float: left; } input[type="submit"] { border: none; background: salmon; padding: 5px 20px; margin-left: 10px; color: #fff; text-transform: uppercase; cursor: pointer; transition: .5s; } input[type="submit"]:hover { box-shadow: 0 2px 10px rgba(0,0,0,.5); } .kotak{ width: 25px; height: 25px; margin: 1px; display: inline-block; </style> <body> <h1>Tangga Berwarna</h1> <form method="post"> <label>Jumlah Anak Tangga</label> : <input type="text" name="jumlah" style="margin-bottom: 10px;" required="required" ><br/> <label>Warna</label> : <input type="radio" name="warna" value="green" required="required">Hijau <input type="radio" name="warna" value="purple" required="required">Ungu <input type="radio" name="warna" value="yellow" required="required">Kuning <input type="radio" name="warna" value="blue" required="required">Biru <input type="radio" name="warna" value="grey" required="required">Abu - Abu <input type="submit" name="" value="Buat Tangga"> </form> <body> <html>

tanggawarna.php

<?php if (isset($_POST['warna']) && isset($_POST['jumlah'])) { $warna = $_POST['warna']; $jumlah = $_POST['jumlah']; if (!empty($warna) || !empty($jumlah)) { for ($i=0; $i <= $jumlah; $i++){ for ($j = 0; $j < $i ; $j++) { echo "<div class='kotak' style='background-color: $warna'></div>"; } echo "<br/>"; } } else{ die("Isi dengan lengkap form diatas"); } } ?>