<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
}
form{
width: 300px;
height: 300px;
border: 1px solid blue;
}
input:checked+label{
display: inline-block;
width: 50px;
height: 50px;
background-color: blue;
}
textarea{
width: 200px;
height: 100px;
outline: none;
}
</style>
</head>
<body>
<form action="" method="get">
<input type="text" placeholder="请输入">
<!--或者加value属性添加一个初始值-->
<input type="password">
<fieldset><!-- 在form表单中开辟一个独立区域 -->
<legend>单选按钮</legend>
<input type="radio" name="gender" id="man" checked><label for="man">男</label>
<input type="radio" name="gender" id="woman"><label for="woman">女</label>
<!--不用label也可以-->
<input type="checkbox" name="fruit" id="a"><label for="a">a</label>
<input type="checkbox" name="fruit" id="b"><label for="b">b</label>
<input type="checkbox" name="fruit" id="c"><label for="c">c</label>
</fieldset>
<input type="submit">
<input type="reset">
<input type="file">
<input type="image" src="img/1.jpg">
<button>我是按钮</button>
<select name="" id="" size="2">
<option value="">上海</option>
<option value="">背景</option>
<option value="">广州</option>
<option value="">深圳</option>
</select>
<textarea name="" id="" cols="30" rows="10"></textarea>
</form>
<!--
form 块级元素
action属性,指定将form中的各个表单的数据发送到哪个地址
method属性,指定数据发送的收使用是什么方式
input 行内块
type='text'文本框
type='password'密码框
type='radio'单选框
<input type="radio" name="gender" id="man"><label for="man">男</label>
<input type="radio" name="gender" id="woman"><label for="woman">女</label>
name用来告诉浏览器这几个单选是一起的 同时也是传值时候键值对的键 id 和 for 是为了用户体验 点击字就可以
checked默认选中 可以在css中设置伪类选择器 input:checked{}
input:checked+label{} 选中被点击选择的单选按钮设置样式
label 行内元素
select 行内块
size下拉框显示几条(不要设置高度)
可以设置selected
textarea
可以直接设置宽高 但是可以拉伸
在标签上 cors长 rows宽
在css中设置resize: none;可以固定长宽
horizontal水平可拉
vertical竖直可拉
input:focus获取焦点
a标签和input标签可以通过鼠标或者Tab键选中出现蓝色边框表示被焦点选中
这个蓝色的边框可以用outline: none;去掉
focus可以获取到焦点进行操作
-->
</body>
</html>
Python3Turtle