Web-программирование, HTML/CSS
(Различия между версиями)
Gusarev (обсуждение | вклад) (→21.20.2021) |
Gusarev (обсуждение | вклад) |
||
Строка 15: | Строка 15: | ||
===21.20.2021=== | ===21.20.2021=== | ||
+ | ====Формы (простой вариант)==== | ||
<source lang="html4strict"> | <source lang="html4strict"> | ||
<html> | <html> | ||
Строка 27: | Строка 28: | ||
<input type="submit" value="Ага, согласен"> | <input type="submit" value="Ага, согласен"> | ||
</form> | </form> | ||
+ | </body> | ||
+ | </html> | ||
+ | </source> | ||
+ | |||
+ | ====Формы (вариант посложнее)==== | ||
+ | <source lang="html4strict"> | ||
+ | <html> | ||
+ | <head> | ||
+ | <link rel="stylesheet" href="variables.css"> | ||
+ | <title> | ||
+ | Forms (extra) | ||
+ | </title> | ||
+ | </head> | ||
+ | <body> | ||
+ | <form> | ||
+ | <div> | ||
+ | <p><input name="user_name" type="text" placeholder="User name"></p> | ||
+ | <p><input name="password" type="password" placeholder="password"></p> | ||
+ | </div> | ||
+ | <div> | ||
+ | Favorite color? | ||
+ | <input name="color" type="radio" value="white"> White | ||
+ | <input name="color" type="radio" value="black"> Black | ||
+ | <input name="color" type="radio" value="red"> Red | ||
+ | <input name="color" type="radio" value="blue"> Blue | ||
+ | <input name="color" type="radio" value="green"> Green | ||
+ | </div> | ||
+ | <div> | ||
+ | <input name="ocean" list="oceans" placeholder="Oceans"> | ||
+ | <datalist id="oceans"> | ||
+ | <option value="Pacific"> | ||
+ | <option value="Indian"> | ||
+ | <option value="Atlantic"> | ||
+ | <option value="Arctic"> | ||
+ | </datalist> | ||
+ | </div> | ||
+ | |||
+ | <div> | ||
+ | <input type="checkbox" id="fav_oceans" name="fav_oceans" checked> | ||
+ | <label for="pacific">Pacific</label> | ||
+ | </div> | ||
+ | <div> | ||
+ | <input type="checkbox" id="fav_oceans" name="fav_oceans"> | ||
+ | <label for="indian">Indian</label> | ||
+ | </div> | ||
+ | </div> | ||
+ | <div> | ||
+ | <input type="checkbox" id="fav_oceans" name="fav_oceans"> | ||
+ | <label for="Arctic">Arctic</label> | ||
+ | </div> | ||
+ | <div> | ||
+ | <input type="checkbox" id="fav_oceans" name="fav_oceans" checked> | ||
+ | <label for="Atlantic">Atlantic</label> | ||
+ | </div> | ||
+ | </form> | ||
+ | |||
</body> | </body> | ||
</html> | </html> | ||
</source> | </source> |
Версия 13:52, 22 октября 2021
Содержание |
Какими программами пользоваться
Notepad++ |
VS Code |
Материалы некоторых занятий
21.20.2021
Формы (простой вариант)
<html>
<head>
<title>Forms</title>
</head>
<body>
<form>
<input type="text"
placeholder="Type here..."
name="just_text">
<input type="submit" value="Ага, согласен">
</form>
</body>
</html>
Формы (вариант посложнее)
<html>
<head>
<link rel="stylesheet" href="variables.css">
<title>
Forms (extra)
</title>
</head>
<body>
<form>
<div>
<p><input name="user_name" type="text" placeholder="User name"></p>
<p><input name="password" type="password" placeholder="password"></p>
</div>
<div>
Favorite color?
<input name="color" type="radio" value="white"> White
<input name="color" type="radio" value="black"> Black
<input name="color" type="radio" value="red"> Red
<input name="color" type="radio" value="blue"> Blue
<input name="color" type="radio" value="green"> Green
</div>
<div>
<input name="ocean" list="oceans" placeholder="Oceans">
<datalist id="oceans">
<option value="Pacific">
<option value="Indian">
<option value="Atlantic">
<option value="Arctic">
</datalist>
</div>
<div>
<input type="checkbox" id="fav_oceans" name="fav_oceans" checked>
<label for="pacific">Pacific</label>
</div>
<div>
<input type="checkbox" id="fav_oceans" name="fav_oceans">
<label for="indian">Indian</label>
</div>
</div>
<div>
<input type="checkbox" id="fav_oceans" name="fav_oceans">
<label for="Arctic">Arctic</label>
</div>
<div>
<input type="checkbox" id="fav_oceans" name="fav_oceans" checked>
<label for="Atlantic">Atlantic</label>
</div>
</form>
</body>
</html>