Створи веб-сторінку за зразком. Спробуй натиснути кнопку "Відправити" не заповнивши поля, або не поставивши позначки. Досліди що відбувається. За допомогою якого атрибута тегу input це відбувається?
Створи веб-сторінку за зразком. Спробуй ввести логін довший 6 символів, або вік менше 18 років. Досліди що відбувається. За допомогою яких атрибутів тегу input це відбувається?
Створи веб-сторінку за зразком. Досліди що відбувається, коли форми не заповнені, заповнені правильно, або неправильно. За допомогою яких елементів веб-сторінки це відбувається. Код сторінки можна скопіювати.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Використання псевдокласів CSS</title>
<style>
input:focus:invalid,
textarea:focus:invalid{ border:1px solid #F5192F;
box-shadow:0 0 4px #F5192F;}
input:focus:valid,
textarea:focus:valid{border: 1px solid #64C364;
box-shadow: 0 0 4px #64C364;}
</style>
</head>
<body>
<form>
<p>Введіть ваше ім'я (не більше 10 символів)</p>
<input type="text" name="login" required maxlength="10">
<p>Залиште свій коментар (не більше 100 знаків)</p>
<textarea name="textarea" required maxlength="100"></textarea>
<br> Введіть свій вік<br>
<input type="number" name="age" min="18" required>
<br>
<br>
<input type="submit" value="Відправити">
</form>
</body>
</html>