发现 表头超出了DIV的宽度,并且在拉到横向滚动条时,表头不自动滚动
把
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这句删除,一切就正常了。
请问哪位有办解决这个问题具体问题见
http://topic.csdn.net/u/20071205/20/22d2f4e0-770b-4d37-aed8-1e6b7fbe4ff8.html?seed=1384382081
把
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这句删除,一切就正常了。
请问哪位有办解决这个问题具体问题见
http://topic.csdn.net/u/20071205/20/22d2f4e0-770b-4d37-aed8-1e6b7fbe4ff8.html?seed=1384382081
FlashElf (曲滨*銘龘鶽)
的代码是能用的,但他的代码前边加上<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
就不行了。
本想复制代码上来,结果CSDN说不能发这么长什么回车呀换行呀之类的。改了3分钟,也发不上来。只好引用了
不同的DOCTYPE 对页面中的css有影响
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--固定行列头,曲滨20071207-->
<style type="text/css"> <!-- body,table, td, a { font:9pt; }/*重点:固定行头样式*/.scrollRowThead
{ position: relative;
left: expression(this.parentElement.parentElement.parentElement.parentElement.scrollLeft);
z-index:0;}
/*重点:固定表头样式*/.scrollColThead { position: relative;
top: expression(this.parentElement.parentElement.parentElement.scrollTop);
z-index:2;}/*行列交叉的地方*/.scrollCR { z-index:3;} /*div外框*/.scrollDiv {
position: relative;
height:200px;
clear: both;
border: 1px solid #EEEEEE;
OVERFLOW: scroll;}/*行头居中*/.scrollColThead td,.scrollColThead th
{ text-align: center ;
background-color:#EEEEEE;}/*行头列头背景*/.scrollRowThead
,.scrollColThead td
,.scrollColThead th
{
background-color:#eeeeee;
}/*表格的线*/.scrolltable
{
border-bottom:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
}/*单元格的线等*/.scrolltable td,.scrollTable th
{ border-left: 1px solid #CCCCCC; border-top: 1px solid #CCCCCC; padding: 5px; } --> </style>
</head>
<body>
<div id="scrollDiv" class="scrollDiv">
<table border="0" cellpadding="3" cellspacing="0" width="100%" class="scrollTable">
<tr class="scrollColThead">
<th class="scrollRowThead scrollCR" >
</th>
<th colspan="2">
列头</th>
<th colspan="10">
列头</th>
</tr>
<tr class="scrollColThead">
<th class="scrollRowThead scrollCR">
h1</th>
<th>
h2</th>
<th>
h3</th>
<th>
h4</th>
<th>
h5</th>
<th>
565656</th>
<th>
565656</th>
<th>
5656565656</th>
<th>
56565656</th>
<th>
56565656</th>
<th>
56565656</th>
<th>
56565656</th>
<th>
5656666666666666666666666
66666666666666666666666666
66666666666666666565656</th>
</tr>
<tr>
<td class="scrollRowThead">
<input type="checkbox" name="checkbox" value="checkbox">
a</td>
<td>
单元格2</td>
<td>
单元格3</td>
<td>
单元格4</td>
<td>
单元格5</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="scrollRowThead">
<input type="checkbox" name="checkbox2" value="checkbox">
b</td>
<td>
单元格2</td>
<td>
单元格3</td>
<td>
单元格4</td>
<td>
单元格5</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td nowrap class="scrollRowThead">
<input type="checkbox" name="checkbox3" value="checkbox">
1</td>
<td nowrap>
单元格2</td>
<td nowrap>
单元格3</td>
<td nowrap>
单元格4</td>
<td nowrap>
单元格5</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
<td nowrap>
</td>
</tr>
<tr>
<td class="scrollRowThead">
<input type="checkbox" name="checkbox4" value="checkbox">
2</td>
<td>
单元格2</td>
<td>
单元格3</td>
<td>
单元格4</td>
<td>
单元格5</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="scrollRowThead">
<input type="checkbox" name="checkbox5" value="checkbox">
3</td>
<td>
单元格2</td>
<td>
单元格3</td>
<td>
单元格4</td>
<td>
单元格5</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="scrollRowThead">
<input type="checkbox" name="checkbox6" value="checkbox">
4</td>
<td>
单元格2</td>
<td>
单元格3</td>
<td>
单元格4</td>
<td>
单元格5</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td class="scrollRowThead">
<input type="checkbox" name="checkbox7" value="checkbox">
5</td>
<td>
单元格2</td>
<td>
单元格3</td>
<td>
单元格4</td>
<td>
单元格5</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
</tr>
</table>
</div>
</body>
</html>
5656666666666666666666666
66666666666666666666666666
66666666666666666565656
这里改一行,不要看不出效果
这个小问题也不用在发个贴啊、给我发个email 不就得了我blog 上有
楼主分很多吗?
position: relative;
我现在头痛的是C# 里的GridView会自动在源码里加一个没属性的DIV,这个DIV 有存在,让固定列头没有效果
谢谢
曲滨*銘龘鶽