【分享】VS200X水晶报表边框效果在WEB页面不连续显示问题解决方法

本文难度系数0，重要的是分享解决问题的这个过程，而不是结果。 针对版本：VS2005或VS2008及内置的水晶报表 为了实现导出时的格线显示，我们一般会用字段边框来模拟线。 这个具体可参考我之前写的 【水晶报表内功心法】--完美Excel(上) 【水晶报表内功心法】--完美Excel(下) 本例中，我这样设计边框，左边第一个字段边框为：左，右，下；其余的字段为右，下。 设计过程中字段与节间已经没有空隙 设计界面上预览一下效果还可以(有一点不太明显的间隙) 放大到200%，线条是连续的 但是运行后，WEB页面上，就出现了两个问题。 问题1：边框不显示,原来设计时的线条都没有了 解决方法： HTML模式下，删除aspx页面内的 HTML code <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > 相关文章：Asp.Net水晶报表边框不显示之解决方法 问题2：模板设计时已经没有空闲，在设计界面预览效果也不错，但是执行后在WEB页面上却出现了断续   本文主要解决这个问题。 既然是在页面上出现了这个问题，那么我们就来分析这个页面的HTML代码，看问题出来哪里。 打开运行后的页面的HTML代码，发现水晶报表自动生成了很多代码。 我们首选要找到，两个行切换的那个位置，如下图的HTML代码段 这样我们基本确定了原因， 所以我们的主要目标就是把这3px补上去，下面继续分析这段HTML代码 找到对应的CSS定义 CSS code <style> div.crystalstyle div { position : absolute ; z-index : 25 } div.crystalstyle a { text-decoration : none } div.crystalstyle a img { border-style : none ; border-width : 0 } .fce7be487d-a99b-4169-8afa-8854a6e7b1f9-0 { font-size : 9pt ; color : #000000 ; font-family : 宋体 ; font-weight : normal ; text-decoration : underline ; } .fce7be487d-a99b-4169-8afa-8854a6e7b1f9-1 { font-size : 9pt ; color : #000000 ; font-family : 宋体 ; font-weight : normal ; } .adddca73ac-bf3a-4fed-9130-09057213ccaa-0 { border-color : #000000 ; border-left-width : 0 ; border-right-width : 0 ; border-top-width : 0 ; border-bottom-width : 0 ; } .adddca73ac-bf3a-4fed-9130-09057213ccaa-1 { border-color : #000000 ; border-style : solid ; border-width : 0px ; border-left-style : solid ; border-left-width : 1 ; border-right-style : solid ; border-right-width : 1 ; border-top-width : 0 ; border-bottom-style : solid ; border-bottom-width : 1 ; } .adddca73ac-bf3a-4fed-9130-09057213ccaa-2 { border-color : #000000 ; border-style : solid ; border-width : 0px ; border-left-width : 0 ; border-right-style : solid ; border-right-width : 1 ; border-top-width : 0 ; border-bottom-style : solid ; border-bottom-width : 1 ; } </style> 我们来替换掉这段样式，首先我们定义自己的样式段，放在aspx页面的html代码内。 CSS code <style type="text/css"> div.mytd1 { font-size : 9pt ; color : #000000 ; font-family : 宋体 ; font-weight : normal ; Height : 17px ; border-color : #000000 ; border-style : solid ; border-width : 0px ; border-left-style : solid ; border-left-width : 1 ; border-right-style : solid ; border-right-width : 1 ; border-top-width : 0 ; border-bottom-style : solid ; border-bottom-width : 1 ; } div.mytd2 { font-size : 9pt ; color : #000000 ; font-family : 宋体 ; font-weight : normal ; Height : 17px ; border-color : #000000 ; border-style : solid ; border-width : 0px ; border-left-width : 0 ; border-right-style : solid ; border-right-width : 1 ; border-top-width : 0 ; border-bottom-style : solid ; border-bottom-width : 1 ; } span.mytd1 { font-size : 9pt ; color : #000000 ; font-family : 宋体 ; Height : 17px ; } span.mytd2 { font-size : 9pt ; color : #000000 ; font-family : 宋体 ; Height : 17px ; } </style> 因为CSDN不支持二层的UBB解析，所以不能做进一步的标记。 所以说明一下，这几个样式里重点是Height:17px; 但是因为用了自定义样式后，会把全局的样式定义覆盖掉，所以要把全局的定义也放进来，就是字体的那部分 至于为什么要把同一个样式名称mytd1，分到两个不同的HTML标记里，参考我之前的文章 Asp.Net水晶报表边框不显示之解决方法 后面的一部分。 好了，现在把这两个样式给到对于的字段（仅以第一个字段为例） 现在运行，看一下结果 ,就是我们想要的。