JS实现控制表格行内容垂直对齐的方法


Posted in Javascript onMarch 30, 2015

本文实例讲述了JS实现控制表格行内容垂直对齐的方法。分享给大家供大家参考。具体分析如下:

下面的代码通过表格的vAlign属性控制表格行的内容垂直对齐,可以置顶、可以居中、可以底部对齐

<!DOCTYPE html>
<html>
<head>
<script>
function topAlign()
{
document.getElementById('tr2').vAlign="top";
}
</script>
</head>
<body>
<table width="50%" border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
<th>Text</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
<td>Hello my name is Peter Griffin.
I need a long text for this example.
I need a long text for this example.</td>
</tr>
</table>
<br>
<input type="button" onclick="topAlign()" value="Top-align table row" />
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript 学习之旅 (3)
Feb 05 Javascript
JS打印gridview实现原理及代码
Feb 05 Javascript
关于extjs4如何获取grid修改后的数据的问题
Aug 07 Javascript
Jquery中CSS选择器用法分析
Feb 10 Javascript
jquery带动画效果幻灯片特效代码
Aug 27 Javascript
JS+CSS实现闪烁字体效果代码
Apr 05 Javascript
第九篇Bootstrap导航菜单创建步骤详解
Jun 21 Javascript
Vue.js第二天学习笔记(vue-router)
Dec 01 Javascript
基于webpack-hot-middleware热加载相关错误的解决方法
Feb 22 Javascript
jQuery实现表单动态添加与删除数据操作示例
Jul 03 jQuery
jQuery实现输入框的放大和缩小功能示例
Jul 21 jQuery
详解Vue-cli3.X使用px2rem遇到的问题
Aug 09 Javascript
JS实现控制表格内指定单元格内容对齐的方法
Mar 30 #Javascript
JS实现控制表格单元格垂直对齐的方法
Mar 30 #Javascript
JavaScript动态改变表格单元格内容的方法
Mar 30 #Javascript
Node.js中的流(Stream)介绍
Mar 30 #Javascript
Node.js 异步编程之 Callback介绍(一)
Mar 30 #Javascript
js动态修改表格行colspan列跨度的方法
Mar 30 #Javascript
jQuery使用hide方法隐藏页面上指定元素的方法
Mar 30 #Javascript
You might like
PHP+Ajax实时自动检测是否联网的方法
2015/07/01 PHP
WordPress中注册菜单与调用菜单的方法详解
2015/12/18 PHP
图文详解phpstorm配置Xdebug进行调试PHP教程
2016/06/13 PHP
为什么要在引入的css或者js文件后面加参数的详细讲解
2013/05/03 Javascript
Jquery 动态生成表格示例代码
2013/12/24 Javascript
Javascript核心读书有感之类型、值和变量
2015/02/11 Javascript
JavaScript使用Max函数返回两个数字中较大数的方法
2015/04/06 Javascript
JavaScript实现自动变换表格边框颜色
2015/05/08 Javascript
jQuery插件实现带圆点的焦点图片轮播切换
2016/01/18 Javascript
设计模式中的组合模式在JavaScript程序构建中的使用
2016/05/18 Javascript
jQuery文件上传控件 Uploadify 详解
2016/06/20 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(二)
2017/05/11 Javascript
基于daterangepicker日历插件使用参数注意的问题
2017/08/10 Javascript
Node.js自定义实现文件路由功能
2017/09/22 Javascript
Vue 中批量下载文件并打包的示例代码
2017/11/20 Javascript
Vue 重置组件到初始状态的方法示例
2018/10/10 Javascript
vue里如何主动销毁keep-alive缓存的组件
2019/03/21 Javascript
详解Vue源码学习之双向绑定
2019/04/10 Javascript
细说Vue组件的服务器端渲染的过程
2019/05/30 Javascript
python 输出一个两行字符的变量
2009/02/05 Python
分享几道你可能遇到的python面试题
2017/07/24 Python
Python实现的微信好友数据分析功能示例
2018/06/21 Python
Python序列化pickle模块使用详解
2020/03/05 Python
Django中文件上传和文件访问微项目的方法
2020/04/27 Python
pandas参数设置的实用小技巧
2020/08/23 Python
使用python-cv2实现Harr+Adaboost人脸识别的示例
2020/10/27 Python
HTML5进阶段内联标签汇总(小篇)
2016/07/13 HTML / CSS
城市观光通行证:The Sightseeing Pass
2018/04/28 全球购物
Black Halo官方网站:购买连衣裙、礼服和连体裤
2018/06/13 全球购物
技术总监岗位职责
2013/12/05 职场文书
报关员个人职业生涯规划书
2014/03/12 职场文书
大学学习计划书范文
2014/05/02 职场文书
机械工程及自动化专业求职信
2014/09/03 职场文书
检察院院长群众路线教育实践活动个人整改措施
2014/10/04 职场文书
党组织领导班子整改方案
2014/10/25 职场文书
学期个人自我总结
2015/02/13 职场文书