<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单</title>
</head>
<body>
<p>创建文本字段</p>
<from action="">
账号：<input type="text" name="zhanghao"><br>
密码：<input type="password" name="password">
<p>表单本身是不可见的。并且注意一个文本字段的默认宽度是20个字符</p>
</from>
<from> <!-- 单选按钮 -->
<p>1.你的性别是？</p>
<input type="radio" name="sex" value="male">male。
<input type="radio" name="sex" value="famale">famale.
</from>
<br><br>
<from> <!-- 复制框 -->
<p>2.选择你喜欢的水果？</p>
<input type="checkbox" name="fruit" value="yellow">banana
<input type="checkbox" name="fruit" value="red">apple
</from>
<from>
<p>3.给你整一个可以提交的文本框。</p>
请输入你的名字：<input type="text">
<input type="submit" name="user">
</from>
<br>
<form action="">
<p>4.在这里设置一个可以下拉的文本框。</p>
请选择你喜欢的水果
<select name="fruit">
<option value="apple">苹果</option>
<option value="orang">橘子</option>
<option value="banana">香蕉</option>
<option value="other" selected>是其他的水果</option> <!--会优先显示这个内容-->
</select>
</form>
<p>5.对这个内容还有什么补充吗？</p>
<textarea name="name_text" id="id_text" cols="50" rows="8">在这里请输入你的想法：</textarea>
<form action="">
<fieldset>
<legend>6.设置一个带边框的表格</legend>
姓名：<input type="text" size="10"><br>
微信：<input type="text" size="30"><br>
住址：<input type="text" size="50">
</fieldset>
</form>
<p>7.带有信息的文本。</p>
<form action="demo-form.php">
年龄：<input type="text" name="age" value="18"><br>
地址：<input type="text" name="adress" value="北京市海淀区" size="50"><br>
请提交你的信息<input type="submit">
</form>
<form action="demo-form.php" method="get">
<p>8.这是带有复制框信息的表单</p>
<input type="checkbox" name="vehicle[]" value="bike" checked="checked">我有一辆自行车 <br>
<input type="checkbox" name="vehicle[]" value="car" checked="checked">我有一辆大众车 <br>
<input type="submit">
<form action="MAILTO:lianglizhe777@126.com" method="post" enctype="text/plain">
<p>9.从表单发送电子邮件</p>
姓名：   <input type="text" value="--"><br>
E-mail：<input type="text" value="@126.com"><br>
描述：   <input type="text" size="50"><br>
<input type="submit" value="发送信息">
<input type="reset" value="重置信息">
</form>
<form action="demo-form.php" method="get">
<p>10.选择一个你常用的浏览器。</p>
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<input type="submit">
</form>
<p>11.定义一个可以计算的结果。</p>
<form action="" oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" id="a" value="50">100
+<input type="number" id="b" value="50">
=<output name="x" for="a b"></output>
</form>
</body>
</html>
展示
HTML框架
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>框架</title>
</head>
<body>
<p>1.我想设置一个框架</p>
<iframe src="out01.html" frameborder="10" width="240" height="200"></iframe>
<p>2.我想设置一个框架</p>
<!-- 在框架中显示链接中的内容-->
<iframe src="out01.html" frameborder="10" width="240" height="200" name="iframe_a"></iframe>
<p><a href="https://blog.csdn.net/weixin_45568391?t=1" target="iframe_a">这是我的博客</a></p>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>out01.html</title>
</head>
<body>
<div style="background-color:green;width:200px;height:500px"><p>你好绿色！</p></div>
</body>
</html>
2817
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
