td | 易学教程

CSS控制table中的文字垂直居中

阅读更多关于 CSS控制table中的文字垂直居中

在使用table过程中，我们总是碰到在不同列中可能文字内容量不同，在同一行中，有的列文字可能比较多，导致其他列文字较少的列内容只能呈现在左上角，这时候我们需要将内容都垂直居中。只需要在td上添加一个CSS即可： td { vertical-align : middle ; } 添加这个CSS样式之后，我们可以再打开table看看，文字是不是已经垂直居中了呢？来源： CSDN 作者： tpf1220 链接： https://blog.csdn.net/u011455192/article/details/72235873

css中table居中设置

阅读更多关于 css中table居中设置

css文件： div{ text-align: center; } table{ margin: auto; } html 文件： <div> <table> <tr><td></td></tr> </table> </div> 来源： CSDN 作者： maszxy88 链接： https://blog.csdn.net/maszxy88/article/details/6996683

jQuery-表单流程导航

阅读更多关于 jQuery-表单流程导航

1:为了方便实例的演示，将所有演示所需的几个静态文件放在了同一个目录下了 2:index.html文件，此小白例演示的主页面，同一个页面通过隐藏、显示来控制流程的流转效果 <! DOCTYPE > < html > < head > < meta http-equiv ="Content-Type" content ="text/html; charset=utf-8" /> < title > jQuery表单流程导航 </ title >  < script type ="text/javascript" src ="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" ></ script >  < script type ="text/javascript" src ="progress.js" ></ script >  < script type ="text/javascript" src ="progress.js" ></ script >  < link type ="text/css" rel ="stylesheet" href ="progress

页面点击事件，元素点击事件

阅读更多关于页面点击事件，元素点击事件

html元素的点击事件 <tr><td class=".cus_td" data-id="djlfd">dddd</td><tr> $('body').on('click',".cus_td", function(){ var modelId=$(this).attr("data-id"); layer.open({ type: 2, title: '车辆定损', shadeClose: true, shade: 0.8, area: ['90%', '92%'], content: '<%=basePath%>whole/detail/'+modelId, end: function () { console.log('end'); // location.reload(); } }); }); 　　来源： https://www.cnblogs.com/lazyli/p/11511911.html

TRTD使用

阅读更多关于 TRTD使用

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link href="bootstrap-3.3.7-dist/css/bootstrap.css"rel="stylesheet"> <style> img{ border-radius:100%; overflow:hidden; } h6{ color: cadetblue; } </style> </head> <body> <div class="container" style="margin-top: 5%"> <table cellpadding="0" class="table table-striped table-hover table-condensed "> <thead> <tr> <td> <h3>课堂直播</h3> </td> </tr> <tr> <td> <img src="1.jpg" > </td> <td> 今天20:00 <a href="#" style="color: green">丨开启提醒</a><br> 运营插画四部曲 <br> <h6>艾琦aiki</h6> </td> <td> <img src="2.png" alt=""> </td> <td>今天20

js 导出 html 中的 table 表格为 excel

阅读更多关于 js 导出 html 中的 table 表格为 excel

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body { padding: 1em; } </style> </head> <body> <div class="box"> <div> <button type="button" id="excelBtn">导出Excel方法五</button> </div> <div id="myDiv"> <table id="tableExcel" width="100%" border="1" cellspacing="0" cellpadding="0">  <caption>学生成绩表</caption> <tr>  <th rowspan="2">编号</th> <th rowspan="2">学号</th> <th rowspan="2">姓名</th> <th rowspan="2">性别</th> <th rowspan="2">年龄</th> <th colspan="3">成绩</th> </tr> <tr> <th>语文</th> <th

vue实现购物车功能

阅读更多关于 vue实现购物车功能

请看如下代码： <template> <div v-if="goods_list.length"> <table> <thead> <tr> <th>商品名称</th> <th>单价</th> <th>购买数量</th> <th>合计</th> <th>操作</th> </tr> </thead> <tbody> <tr v-for="(goods,index) in goods_list"> <td>{{ goods.name }}</td> <td>{{ goods.price }}</td> <td><input type="text" size="5" :value="goods.num" /></td> <td>{{ goods.price * goods.num}}</td> <td> <a href="javascript:;">删除</a> </td> </tr> </tbody> </table> <div> 共{{ count }}件商品购物车总金额：￥{{total}}元 </div> </div> <div v-else>购物车为空</div> </template> 商品总和以及商品总价如何计算呢？当然是利用“计算属性”了。在计算属性中，通过for循环，累加来得到商品总和和商品总价 computed:{ count : function

HTML中的table表格重叠的边框去除以及合并方法

阅读更多关于 HTML中的table表格重叠的边框去除以及合并方法

table表格中的边框会重叠到一起，使用标签中的border-collapse属性就可以了 <table border-collapse="collapse" > <tr><th>内容（标题）</th><th>内容（标题）</th><th>内容（标题）</th></tr> <tr><td>内容</td><td>内容</td><td>内容</td></tr> <tr><td>内容</td><td>内容</td><td>内容</td></tr> </table> 使用border-collapse之后就能够清除掉重复的边框。合并table表格的方法纵向合并：colspan + 合并数目横向合并：rowspan + 合并数目 1.纵向合并是指合并指定数目的列。 2.横向合并是指合并指定数目的行。 3.其中合并的数目是你要合并的总数目减一。 4.都是td标签中的属性。写法: <tr><td colspan="2" rowspan="2"></td></tr> 来源： https://my.oschina.net/u/2618715/blog/3104295

22案例全选和全不选的实现

阅读更多关于 22案例全选和全不选的实现

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> * { padding: 0; margin: 0; } .wrap { width: 300px; margin: 100px auto 0; } table { border-collapse: collapse; border-spacing: 0; border: 1px solid #c0c0c0; width: 300px; } th, td { border: 1px solid #d0d0d0; color: #404060; padding: 10px; } th { background-color: #09c; font: bold 16px "微软雅黑"; color: #fff; } td { font: 14px "微软雅黑"; } tbody tr { background-color: #f0f0f0; } tbody tr:hover { cursor: pointer; background-color: #fafafa; } </style> </head> <body> <div class="wrap"> <table> <thead> <tr> <th> <input type=

浅谈HttpRunner 做Http接口自动化测试

阅读更多关于浅谈HttpRunner 做Http接口自动化测试

HttpRunner 框架简介 HttpRunner 是一款面向 HTTP(S) 协议的通用测试框架，只需编写维护一份 YAML/JSON 脚本，即可实现自动化测试、性能测试、线上监控、持续集成等多种测试需求【引用作者简述】相关链接 HttpRunner中文使用文档 Github_HttpRunner 作者博客-DebugTalk 框架对比框架最新版本开发语言支持语言持续集成拓展难度性能测试数据分离推广门槛其它特性 Robot Framework 3.1.2 python python/java 是高不支持支持低自带wx的GUI,可支持界面化或命令操作，可支持web UI自动化seleniumLibrary HttpRunner 2.0 python python 是中支持支持高脚本化、有完善易阅读报告输出 Jmeter 5.1.1 java java 是高支持支持低更偏向于接口性能；做功能测试，用例维护管理难 HttpRunner 模块化架构关于HttpRunner框架详情，在此不做过多介绍，本次内容主要以实战为主 HttpRunner 环境安装因 python2.7版本已停止更新，不在维护，大部分相关开源项目与库已不再对 python2.x 版本的支持，所以此处用 Python3.6 + HttpRunner 1