JS实现控制表格行文本对齐的方法
本文实例讲述了JS实现控制表格行文本对齐的方法。分享给大家供大家参考。具体如下:
下面的JS代码可以控制表格内的整行文本向左或者向右对齐
<!DOCTYPE html> <html> <head> <script> function leftAlign() { document.getElementById('header').align="left"; } </script> </head> <body> <table width="100%" border="1"> <tr id="header"> <th>Firstname</th> <th>Lastname</th> </tr> <tr> <td>Peter</td> <td>Griffin</td> </tr> </table> <br> <input type="button" onclick="leftAlign()" value="Left-align table row"/> <p><b>Note:</b> This example does not work in Internet Explorer.</p> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。
相关推荐
-
text-align:justify实现文本两端对齐 兼容IE
对于text-align 我们再熟悉不过了,可是它有个justify属性,平时很少用到,就鲜为人知了.justify是一种文本靠两边布局方式,一般应用于书刊杂志排版:合理运用text-align:justify 有时会省去很多开发的时间. 要想更好的理解 css, 尤其是 IE 下对 css 的渲染,haslayout 是一个非常有必要彻底弄清楚的概念.大多 IE 下的显示错误,就是源于 haslayout. 什么是 haslayout ? haslayout 是Windows Internet
-
使用text-align:justify实现两端对齐一例
text-align:justify只能对多行中的非最后一行进行两端对齐.对于单行自己没办法,IE有text-justify 可以解决问题,对了非IE的我的方式比较垃圾,因为只在特殊场合下才会用. Example Source Code [www.52css.com] .justify{ height:1.1em; overflow:hidden; text-align:justify; text-justify :distribute-all-lines; } div.cn:after { c
-
JS实现控制表格行文本对齐的方法
本文实例讲述了JS实现控制表格行文本对齐的方法.分享给大家供大家参考.具体如下: 下面的JS代码可以控制表格内的整行文本向左或者向右对齐 <!DOCTYPE html> <html> <head> <script> function leftAlign() { document.getElementById('header').align="left"; } </script> </head> <body&g
-
JS实现控制表格内指定单元格内容对齐的方法
本文实例讲述了JS实现控制表格内指定单元格内容对齐的方法.分享给大家供大家参考.具体如下: 下面的代码控制表格单元格的内容向右对齐 <!DOCTYPE html> <html> <head> <script> function alignCell() { document.getElementById('td1').align="right"; } </script> </head> <body> &l
-
JS实现控制表格行内容垂直对齐的方法
本文实例讲述了JS实现控制表格行内容垂直对齐的方法.分享给大家供大家参考.具体分析如下: 下面的代码通过表格的vAlign属性控制表格行的内容垂直对齐,可以置顶.可以居中.可以底部对齐 <!DOCTYPE html> <html> <head> <script> function topAlign() { document.getElementById('tr2').vAlign="top"; } </script> <
-
JS实现控制表格单元格垂直对齐的方法
本文实例讲述了JS实现控制表格单元格垂直对齐的方法.分享给大家供大家参考.具体如下: 下面的代码控制指定的单元格靠底部垂直对齐 <!DOCTYPE html> <html> <head> <script> function valignCell() { var x=document.getElementById('myTable').rows[0].cells; x[0].vAlign="bottom"; } </script>
-
JS实现控制表格只显示行边框或者只显示列边框的方法
本文实例讲述了JS实现控制表格只显示行边框或者只显示列边框的方法.分享给大家供大家参考.具体分析如下: 通过下面的JS代码你可以控制表格只显示行与行之间的分隔线,也可以只显示列与列之间的分隔线,主要用到了表格对象的rules属性 <!DOCTYPE html> <html> <head> <script> function rowRules() { document.getElementById('myTable').rules="rows&quo
-
JS实现为表格动态添加标题的方法
本文实例讲述了JS实现为表格动态添加标题的方法.分享给大家供大家参考.具体如下: JS中的表格对象带有一个createCaption方法用于为表格创建标题caption <!DOCTYPE html> <html> <head> <script> function createCaption() { var x=document.getElementById('myTable').createCaption(); x.innerHTML="My t
-
JS实现向表格中动态添加行的方法
本文实例讲述了JS实现向表格中动态添加行的方法.分享给大家供大家参考.具体分析如下: 下面的JS代码通过表格对象的insertRow方法动态向表格的最顶端添加新的行 <!DOCTYPE html> <html> <head> <script> function insRow() { var x=document.getElementById('myTable').insertRow(0); var y=x.insertCell(0); var z=x.ins
-
JS动态修改表格cellPadding和cellSpacing的方法
本文实例讲述了JS动态修改表格cellPadding和cellSpacing的方法.分享给大家供大家参考.具体如下: 下面的JS代码通过修改表格对象的cellPadding和cellSpacing属性来修改表格单元格的间距 <!DOCTYPE html> <html> <head> <script> function padding() { document.getElementById('myTable').cellPadding="15&quo
-
纯JS将table表格导出到excel的方法
html <div > <button type="button" onclick="getXlsFromTbl('tableExcel','myDiv')">IE导出Excel方法</button> <button type="button" onclick="method5('tableExcel')">Chrome导出Excel</button> </di
-
JS控制表格实现一条光线流动分割行的方法
本文实例讲述了JS控制表格实现一条光线流动分割行的方法.分享给大家供大家参考.具体分析如下: 这是很漂亮的一个分割行的代码. 其实就是利用JS控制表格实现的一条七彩流光分割横线 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>js用单元格实现的七彩线条</tit
随机推荐
- C++ 中引用与指针的区别实例详解
- AngularJS 整理一些优化的小技巧
- 各种系统中密码文件的位置
- Java 中 synchronized的用法详解(四种用法)
- Bootstrap基本组件学习笔记之按钮组(8)
- Python中不同进制的语法及转换方法分析
- MySQL数据库十大优化技巧
- msyql show命令汇总
- CentOS MySQL 5.7编译安装步骤详细说明
- jquery方法+js一般方法+js面向对象方法实现拖拽效果
- jquery属性过滤选择器使用示例
- 微信小程序 页面跳转及数据传递详解
- js实现随机点名小功能
- c#对象初始化顺序实例分析
- C#中哈希表(Hashtable)的介绍及简单用法
- 详解Android Studio正式签名进行调试的实现步骤
- 关于angularJs清除浏览器缓存的方法
- 尝试Docker+Nginx部署单页应用方法
- Django使用Celery异步任务队列的使用
- JavaScript this在函数中的指向及实例详解