收藏
天蓬老师批改状态：合格
老师批语：棒
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>7月26日作业</title><style>thead {background-color: #dedede;}tfoot {font-size: 20px;}</style></head><body><caption>方案报价单</caption><table border="1" cellspacing="0" cellpadding="5" width="500"><colgroup><col /><col /><col /><col /><col style="background-color: cadetblue;" /></colgroup><thead><tr><td>品名</td><td>单位</td><td>单价</td><td>数量</td><td>金额</td></tr></thead><tbody><tr><td>收款机</td><td rowspan="2">台</td><td>3800</td><td>1</td><td>3800</td></tr><tr><td>条码机</td><!-- <td>台</td> --><td>1500</td><td>2</td><td>3000</td></tr></tbody><tfoot><tr><td colspan="4">合计:</td><!-- <td></td> --><!-- <td></td> --><!-- <td></td> --><td>7000</td></tr></tfoot></table></body></html>
运行效果
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>表单操作</title></head><body><h2>用户注册</h2><hr /><form action=""><fieldset style="width: 400px;"><legend>基础信息</legend><label for="username">用户姓名:</label><!-- placeholder 文本框内提示 required 必填项 autofocus 默认焦点,这三个单词重要,需要多敲 --><!-- required 和autofocus默认是true不输入是false --><inputid="username"type="text"name="username"value=""placeholder="只能输入汉字"requiredautofocus/><div><!-- 只有标签 中for绑定输入框的id时,点标签才定位光标 --><label for="pwd">输入密码:</label><input type="password" id="pwd" name="pwd" value="" required /></div><div><label for="xb">性别:</label><input type="radio" name="xb" value="" id="n" checked /><label for="n">男</label><input type="radio" name="xb" value="" id="v" /><label for="v">女</label><div><label for="xl">学历:</label><select name="xl" id="xl"><option value="cz">初中</option><option value="">高中</option><option value="">大学</option></select></div></div></fieldset><fieldset style="width: 400px;"><legend>联系方式</legend><div><!-- required此属性只要有就是true表示必填项 --><label for="telid">手机号:</label><inputtype="text"id="telid"value=""name="tel"placeholder="请输入11位手机号"required/></div><div><label for="qqid">QQ号:</label><inputtype="text"id="qqid"value=""name="qq"placeholder="请输入QQ号码"/></div><div><label for="email">邮 箱:</label><inputtype="email"id="email"value=""name=""placeholder="XXXX@XXX.com"/></div></fieldset><fieldset style="width: 400px;"><legend>个人情况</legend><div><label for="">爱好:</label><!-- checked有就是true,所以给一个默认值,默认选中此项 --><input type="checkbox" id="yd" name="ah_name" checked /><labelfor="yd">运动</label><input type="checkbox" id="ly" name="ah_name" /><label for="ly">旅游</label><input type="checkbox" id="yy" name="ah_name" /><label for="yy">音乐</label><input type="checkbox" id="tw" name="ah_name" /><label for="tw">跳舞</label></div><div><label for="nl">年龄</label><input type="number" setp="1" max="100" min="18" /></div><div><label for="">婚姻状况:</label><input type="radio" id="wh" name="hyzk" checked /><label for="wh">未婚</label><input type="radio" id="yh" name="hyzk" /><label for="yh">已婚</label></div><div><label for="shz">上传生活照</label><input type="file" id="shz" /><!-- 通过隐藏域控制了上传文件的大小为1k,以减少服务器负担 --><input type="hidden" name="MAX_FILE_SIZE" value="1024" /></div><label for="rsxt">人生信条</label><!-- 这里datalist标签也是双标签,在VSCODE中识别效果不好,注意Input中特殊属性list可以绑定datalist中的id 实现下拉列表效果 --><input type="text" id="rsxt" list="my_list" /><datalist id="my_list"><option value="爱拼才会赢">爱拼才会赢</option><option value="好好学习天天向上">好好学习天天向上</option><option value="我命由我不由天">我命由我不由天</option></datalist><div><label for="gzjl">工作经历</label><textarea name="" id="" cols="30" rows="10"></textarea></div><div><label for="sf">所在省份</label><select name="sf" id="sf"><option value="河南省" selected>河南省</option><option value="山东省">山东省</option><option value="安徽省">安徽省</option></select><label for="sr">生日</label><input type="date" id="sr" name="grsr" /></div><div><label for="mycolor">喜欢的颜色</label><input type="color" id="mycolor" /></div></fieldset><button>提交</button></form></body></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
