<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>练习form表单</title> </head> <body> <!-- 默认的数据提交是get方式 --> <form> <table> <tr> <td> <h3>学生信息管理系统MIS</h3> </td> </tr> <tr> <td> 姓名: </td> </tr> <tr> <td> <input type="text" placeholder="请输入姓名" /> </td> </tr> <tr> <td> 年龄: </td> </tr> <tr> <td> <input type="number" placeholder="请输入年龄" /> </td> </tr> <tr> <td> 性别:(单选框) <input type="radio" value="1"/>男 <input type="radio" value="0"/>女 </td> </tr> <tr> <td> 爱好:(多选) <input type="checkbox" value="1"/>乒乓球 <input type="checkbox" value="2"/>爬山 <input type="checkbox" value="3"/>唱歌 </td> </tr> <tr> <td> 学历:(下拉框) <select> <option value="1">本科</option> <option value="2">专科</option> <option value="3">高中</option> <option value="4">小学</option> </select> </td> </tr> <tr> <td> 入学日期: <br/> <input type="date"/> </td> </tr> <tr> <td> <input type="submit" value="保存" /> <input type="button" value="取消" /> </td> </tr> </table> </form> </body> </html>
四,CSS -1,概述用来修饰网页的,变得好看。层叠样式表stylesheet
-2,语法td{ text-align : center; } 选择器{ 属性名 : 属性值 ; }
-3,入门案例<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>测试 css修饰网页</title> <!-- css写法2:内部css,插入css代码 --> <style> /* 语法:选择器{ 属性名:属性值; } */ /* 给所有div */ div{ color:green; /* 设置字的颜色红色 */ background-color: #008000;/* 设置背景色 */ } </style> </head> <body> <!-- css写法1:行内css--> <div>我是div1</div> <div >我是div2</div> <div>我是div3</div> <div>我是div4</div> <div>我是div5</div> </body> </html>
五,选择器