cpu 内存使用率控件--google浏览器下空表格显示异常问题
2013-04-12 18:17
369 查看
今天在做一个控件的过程中,遇到一些问题,在此总结下。
![](http://img.my.csdn.net/uploads/201304/12/1365761516_1179.GIF)
控件的功能是实现类似windows任务管理器的cpu使用率现实功能,并提供一些用户自定义控件高度义,标题等接口。以便适用于不通的用户场景和页面。控件基于空的table实现,html静态源码大致是这样的:
<table border="0" cellspacing="1" cellpadding="0" style="background-color: #fff;width:40px;" id="proBar1Tbl">
<tbody id="proBar1Tbody">
<tr class="proempty"><td></td><td></td></tr>
<tr class="profill"><td></td><td></td></tr>
<tr class="profill"><td></td><td></td></tr>
......
</tbody>
</table>
但是在google chrome下运行上面源码,发现,表格无法显示出来,但在IE,firefox等下显示正常。最后发现,只要在其中一行的一个td中添加style="display:block;",就可以正常显示了。修改后如下:
<table border="0" cellspacing="1" cellpadding="0" style="background-color: #fff;width:40px;" id="proBar1Tbl">
<tbody id="proBar1Tbody">
<tr class="proempty"><td
style="display:block;"></td><td></td></tr>
<tr class="proempty"><td></td><td></td></tr>
......略
通过上面修改虽然能显示了,但是没达到想要的效果,虽然设置了cellspacing=“1”,但是发现在google chrome下运行还是有问题,列间间隙没显示出来,但在IE,firefox等下可以。最后通过摸索,发现需要设置cellpadding="1"才能在googlechrome下显示列间距。
总结:
1.在google chrome下,要想显示内容空白的table,需要在td中添加style="display:block;";
2.在google chrome下,需要同时添加cellspacing="1" cellpadding="1"属性,才能显示行间距和列间距
~~
控件的功能是实现类似windows任务管理器的cpu使用率现实功能,并提供一些用户自定义控件高度义,标题等接口。以便适用于不通的用户场景和页面。控件基于空的table实现,html静态源码大致是这样的:
<table border="0" cellspacing="1" cellpadding="0" style="background-color: #fff;width:40px;" id="proBar1Tbl">
<tbody id="proBar1Tbody">
<tr class="proempty"><td></td><td></td></tr>
<tr class="profill"><td></td><td></td></tr>
<tr class="profill"><td></td><td></td></tr>
......
</tbody>
</table>
但是在google chrome下运行上面源码,发现,表格无法显示出来,但在IE,firefox等下显示正常。最后发现,只要在其中一行的一个td中添加style="display:block;",就可以正常显示了。修改后如下:
<table border="0" cellspacing="1" cellpadding="0" style="background-color: #fff;width:40px;" id="proBar1Tbl">
<tbody id="proBar1Tbody">
<tr class="proempty"><td
style="display:block;"></td><td></td></tr>
<tr class="proempty"><td></td><td></td></tr>
......略
通过上面修改虽然能显示了,但是没达到想要的效果,虽然设置了cellspacing=“1”,但是发现在google chrome下运行还是有问题,列间间隙没显示出来,但在IE,firefox等下可以。最后通过摸索,发现需要设置cellpadding="1"才能在googlechrome下显示列间距。
总结:
1.在google chrome下,要想显示内容空白的table,需要在td中添加style="display:block;";
2.在google chrome下,需要同时添加cellspacing="1" cellpadding="1"属性,才能显示行间距和列间距
~~
相关文章推荐
- 64位Ubuntu kylin 16.04显示CPU内存使用率
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- [Linux OS] Ubuntu 16.04 上实时显示上下行网速、CPU及内存使用率--indicator-sysmonitor
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率--indicator-sysmonitor
- Ambari server:无法显示内存,CPU等使用率
- linux-raspbian系统下编写python脚本显示树莓派的当前cpu温度、使用率、内存和硬盘信息
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- Ext DateField 控件的日期选择控件DatePicker 布局 显示异常问题
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- 在ubuntu12.04中设置顶栏显示 CPU、内存使用率,CPU温度、网速等信息
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率--indicator-sysmonitor
- paip.提升用户体验----表格显示及控件布局错乱的问题
- 解决WebForm项目在高版本IE下控件显示异常的问题
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- Ubuntu 16.04 标题栏实时显示上下行网速、CPU及内存使用率
- asp.net程序控件显示不正常,HTML编辑器无法显示,表格等页面元素也有异常现象
- Ubuntu 16.04安装indicator-sysmonitor实现导航条显示上下行网速/CPU/内存使用率