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 相关文章推荐
jQuery 使用个人心得
Feb 26 Javascript
javascript 节点遍历函数
Mar 28 Javascript
js获取location.href的参数实例代码
Aug 02 Javascript
node.js开机自启动脚本文件
Dec 24 Javascript
JavaScript计划任务后台运行的方法
Dec 18 Javascript
原生js实现addClass,removeClass,hasClass方法
Apr 27 Javascript
Js动态设置rem来实现移动端字体的自适应代码
Oct 14 Javascript
vue使用axios时关于this的指向问题详解
Dec 22 Javascript
angularjs $http调用接口的方式详解
Aug 13 Javascript
vue实现简单的星级评分组件源码
Nov 16 Javascript
详解如何运行vue项目
Apr 15 Javascript
Vue-Cli 3.0 中配置高德地图的两种方式
Jun 19 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实现快速排序的三种方法分享
2014/03/12 PHP
PHP通过内置函数memory_get_usage()获取内存使用情况
2014/11/20 PHP
Laravel 5框架学习之路由、控制器和视图简介
2015/04/07 PHP
PHP常用技巧汇总
2016/03/04 PHP
Smarty环境配置与使用入门教程
2016/05/11 PHP
js常见表单应用技巧
2008/01/09 Javascript
JS array 数组详解
2009/03/22 Javascript
jQuery实现表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的代码
2010/03/21 Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
2011/02/16 Javascript
JS随即打乱数组实现代码
2012/12/03 Javascript
Jquery的基本对象转换和文档加载用法实例
2015/02/25 Javascript
JavaScript+canvas实现七色板效果实例
2016/02/18 Javascript
JavaScript toUpperCase()方法使用详解
2016/08/26 Javascript
Angular实现下载安装包的功能代码分享
2017/09/05 Javascript
JS常见DOM节点操作示例【创建 ,插入,删除,复制,查找】
2018/05/14 Javascript
element-ui的回调函数Events的用法详解
2018/10/16 Javascript
详解Node.js一行命令上传本地文件到服务器
2019/04/22 Javascript
JAVA面试题 static关键字详解
2019/07/16 Javascript
jquery实现上传文件进度条
2020/03/26 jQuery
[06:21]2014DOTA2国际邀请赛 庆祝VG首阶段领跑;B叔为挣牛排半夜整理情报
2014/07/13 DOTA
Python开发实例分享bt种子爬虫程序和种子解析
2014/05/21 Python
为什么str(float)在Python 3中比Python 2返回更多的数字
2018/10/16 Python
python使用pipeline批量读写redis的方法
2019/02/18 Python
python 处理微信对账单数据的实例代码
2019/07/19 Python
Python 实现判断图片格式并转换,将转换的图像存到生成的文件夹中
2020/01/13 Python
Python动态导入模块:__import__、importlib、动态导入的使用场景实例分析
2020/03/30 Python
深入浅析HTML5中的article和section的区别
2018/05/15 HTML / CSS
马来西亚航空官方网站:Malaysia Airlines
2017/07/28 全球购物
美国保健品专家:Life Extension
2018/05/04 全球购物
函授本科个人自我鉴定
2014/03/25 职场文书
食品销售计划书
2014/04/26 职场文书
先进工作者个人总结
2015/02/15 职场文书
2015年万圣节活动总结
2015/03/24 职场文书
元旦联欢晚会主持词
2015/07/01 职场文书
办公室日常管理制度
2015/08/04 职场文书
详解JSON.parse和JSON.stringify用法
2022/02/18 Javascript