您现在的位置是:首页 > Javascript
当前栏目
CSS写表格
2023-03-14 10:27:10 时间
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content_Type" content="text/html";charset=utf-8> <title>个人信息登记</title> <style> caption{height:50px;font-size:30px;font-weight:bold;} table{border:1px solid gray; border-collapse:collapse; margin:100px auto;} th{height:60px;width:130px; border:1px solid gray; background-color:#D6D3D6;} .topleft{width:120px; background-color:#C6C7C6;} td{height:60px;width:130px; border:1px solid gray; background-color:#C6C7C6; text-align:center;} .t1{width:120px; background-color:#BDBABD;} #out1{border-top:60px solid transparent; border-left:60px solid #BDBABD; height:0px;width:0px; position:relative; float:left;} #out2{border-top:30px solid #D6D3D6; border-left:120px solid transparent; height:0px;width:0px; } #in1{position:absolute; width:50px; top:-60px; left:10px;} #in2{position:absolute; width:50px; top:-30px; left:-10px;} #in3{position:absolute; width:50px; top:-20px; left:-60px;} body{background-color:#123456;} </style> </head> <body> <table> <caption> 个人信息登记 </caption> <tr> <th class="topleft"> <div id="out1"> <div id="in1">类别</div> <div id="in2">内容</div> <div id="in3">姓名</div> </div> <div id="out2"></div> </th> <th>年级</th> <th>性别</th> <th>专业</th> <th>特长</th> </tr> <tr> <td class="t1"> <input type="text" size="12" value="请输入你的名字"> </td> <td> <select> <option>2011</option> <option>2012</option> <option>2013</option> </select> </td> <td> <input type="radio" name="sex">男 <input type="radio" name="sex">女 </td> <td> <select> <option>计科</option> <option>信管</option> <option>信技</option> </select> </td> <td> <textarea rows=2 cols=10> </textarea> </td> </tr> <tr> <td class="t1"> <input type="text" size="12" value="请输入你的名字"> </td> <td> <select> <option>2011</option> <option>2012</option> <option>2013</option> </select> </td> <td> <input type="radio" name="sex">男 <input type="radio" name="sex">女 </td> <td> <select> <option>计科</option> <option>信管</option> <option>信技</option> </select> </td> <td> <textarea rows=2 cols=10> </textarea> </td> </tr> <tr> <td class="t1"> <input type="text" size="12" value="请输入你的名字"> </td> <td> <select> <option>2011</option> <option>2012</option> <option>2013</option> </select> </td> <td> <input type="radio" name="sex">男 <input type="radio" name="sex">女 </td> <td> <select> <option>计科</option> <option>信管</option> <option>信技</option> </select> </td> <td> <textarea rows=2 cols=10> </textarea> </td> </tr> <tr> <td class="t1"> <input type="text" size="12" value="请输入你的名字"> </td> <td> <select> <option>2011</option> <option>2012</option> <option>2013</option> </select> </td> <td> <input type="radio" name="sex">男 <input type="radio" name="sex">女 </td> <td> <select> <option>计科</option> <option>信管</option> <option>信技</option> </select> </td> <td> <textarea rows=2 cols=10> </textarea> </td> </tr> <tr> <td class="t1"> <input type="text" size="12" value="请输入你的名字"> </td> <td> <select> <option>2011</option> <option>2012</option> <option>2013</option> </select> </td> <td> <input type="radio" name="sex">男 <input type="radio" name="sex">女 </td> <td> <select> <option>计科</option> <option>信管</option> <option>信技</option> </select> </td> <td> <textarea rows=2 cols=10> </textarea> </td> </tr> <tr> <td class="t1"> <input type="text" size="12" value="请输入你的名字"> </td> <td> <select> <option>2011</option> <option>2012</option> <option>2013</option> </select> </td> <td> <input type="radio" name="sex">男 <input type="radio" name="sex">女 </td> <td> <select> <option>计科</option> <option>信管</option> <option>信技</option> </select> </td> <td> <textarea rows=2 cols=10> </textarea> </td> </tr> </table> </body> </html>
相关文章
- 鲜为人知但很有用的 HTML 属性
- 翻转再翻转!有意思的水平横向溢出滚动
- 自定义计数器小技巧!CSS 实现长按点赞累加动画
- 过五关!React高频面试题指南
- 软件开发中的十个认知偏差
- 不需要 JS!仅用 CSS 也能达到监听页面滚动的效果!
- 一文读懂TypeScript类型兼容性
- Vue 的响应式原则与双向数据绑定
- 快速掌握 TypeScript 新语法:Infer Extends
- JWT教你如何证明你是我的人!
- 一篇带给你 V8 GC 的实现
- 面试官:请使用JS完成一个LRU缓存?
- 通过可视化来学习JavaScript事件循环
- 新的跨域策略:使用 COOP、COEP 为浏览器创建更安全的环境
- 为什么有人说 vite 快,有人却说 vite 慢?
- 种草 Vue3 中几个好玩的插件和配置
- 超全面的前端工程化配置指南
- Vue 状态管理未来样子
- Volatile关键字能保证原子性么?
- 面试突击:SpringBoot 有几种读取配置文件的方法?