Battery html and css

Web dasturlash
1. $min o‘zgaruvchisi ($minga qiymat forma yordamida kirtiladi, agar qiymat kiritilmagan bo‘lsa bu haqida habar berilishi kerak) 0 dan 59 gacha sonlarni qabul qilishi mumkin. Kirtilgan son qaysi chorakka tegishli ekanligi haqidagi habar ask ettirilsin.(birinchi, ikkinchi, uchinchi, to‘rtinchi chorak).

Son kiriting

function kvadrat_tenglama($son)
{
if($son<0 && $son>59)return false;
return array($result);
}
if(isset($_POST['submit']))
{
$a=intval($_POST['son']);
if(!empty($a))
{
if($a<0 && $a>59)
echo 'Noto`g`ri qiymat kiriildi!';
else{
if($a>15)
echo 'Birinchi chorak!';
else if($a>=15&&$a<30)
echo 'Ikkinchi chorak!';
else if($a>=30&&$a<45)
echo 'Uchinchi chorak!';
else
echo 'To`rtinchi chorak!';
}}
else{
echo "Qiymat kiriting!";
}}
?>

2. Batareyka ko‘rinishini beruvchi qatlam tuzilsin.




*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.main{
height: 250px;
width: 150px;
border: 4px solid gray;
border-radius: 10px;
position: absolute;
top: 345px;
left: 50%;
transform: translate(-50%, -50%);
}
.top{
height: 20px;
width: 40px;
background: gray;
position: absolute;
top: 210px;
left: 50%;
transform: translate(-50%, -50%);
}
.main div{
height: 47px;
width: 140px;
margin: 1px;
border-radius: 5px;
border: 1px solid;
}

Rounded Active and Hover Buttons

«
1
2
3
4
5
6
»