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中的History历史对象
Jan 16 Javascript
JavaScript将数据转换成整数的方法
Jan 04 Javascript
JS cookie中文乱码解决方法
Jan 28 Javascript
详谈jQuery操纵DOM元素属性 attr()和removeAtrr()方法
Jan 22 Javascript
jQuery根据表单name获取值的方法
May 24 Javascript
JavaScript使用forEach()与jQuery使用each遍历数组时return false 的区别
Aug 26 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
Oct 23 Javascript
小程序获取周围IBeacon设备的方法
Oct 31 Javascript
如何在JavaScript中谨慎使用代码注释
Jun 21 Javascript
vue新建项目并配置标准路由过程解析
Dec 09 Javascript
解决vue单页面 回退页面 keeplive 缓存问题
Jul 22 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
Aug 10 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网页后退不再出现过期
2007/03/08 PHP
随时给自己贴的图片加文字的php水印
2007/03/16 PHP
dede3.1分页文字采集过滤规则详说(图文教程)续四
2007/04/03 PHP
PHP多线程抓取网页实现代码
2010/07/22 PHP
PHP获取表单数据与HTML嵌入PHP脚本的实现
2017/02/09 PHP
PHP7修改的函数
2021/03/09 PHP
Asp.Net alert弹出提示信息的几种方法总结
2014/01/29 Javascript
js打造数组转json函数
2015/01/14 Javascript
在JavaScript中如何解决用execCommand(
2015/10/19 Javascript
javascript实现右下角广告框效果
2017/02/01 Javascript
使用layui 渲染table数据表格的实例代码
2018/08/19 Javascript
深入解析ES6中的promise
2018/11/08 Javascript
教你完全理解ReentrantLock重入锁
2019/06/03 Javascript
js实现单元格拖拽效果
2020/02/10 Javascript
javascript实现简单搜索功能
2020/03/26 Javascript
JavaScript实现手机号码 3-4-4格式并控制新增和删除时光标的位置
2020/06/02 Javascript
Vue+scss白天和夜间模式切换功能的实现方法
2021/01/05 Vue.js
[33:28]完美世界DOTA2联赛PWL S3 PXG vs GXR 第三场 12.19
2020/12/24 DOTA
Python实现的Google IP 可用性检测脚本
2015/04/23 Python
Django接受前端数据的几种方法总结
2016/11/04 Python
Python迭代和迭代器详解
2016/11/10 Python
Python 常用的安装Module方式汇总
2017/05/06 Python
Python实现账号密码输错三次即锁定功能简单示例
2019/03/29 Python
Python+selenium点击网页上指定坐标的实例
2019/07/05 Python
详解python实现数据归一化处理的方式:(0,1)标准化
2019/07/17 Python
python生成器推导式用法简单示例
2019/10/08 Python
wxpython多线程防假死与线程间传递消息实例详解
2019/12/13 Python
Python如何使用队列方式实现多线程爬虫
2020/05/12 Python
python文件读取失败怎么处理
2020/06/23 Python
python 实现客户端与服务端的通信
2020/12/23 Python
利用html5 file api读取本地文件示例(如图片、PDF等)
2018/03/07 HTML / CSS
Hertz荷兰:荷兰和全球租车
2018/01/07 全球购物
MYPROTEIN澳大利亚官方网站:欧洲运动营养品牌
2019/06/26 全球购物
您在慕尼黑的跑步商店:Lauf-bar
2019/10/11 全球购物
党小组推荐意见
2015/06/02 职场文书
单位收入证明范本
2015/06/18 职场文书