Opciones html

Cuando vamos a diseñar un informe cuya salida sea un fichero html, el editor de informes personalizables tiene opciones para configurar estilos tanto generales al informe como específicos para controles.

En la configuración del informe y página, podemos establecer un estilo general para el cuerpo (</body>) de la página html generada y establecer opciones para el encabezado (</header>). Veamos un ejemplo:

Estamos aplicando un estilo al cuerpo del html, que consiste en un borde de guiones verdes y de 5 píxels de ancho.

Y establecemos un atributo _<link> _para la cabecera del html.

Así mismo, en las propiedades de un control podemos también aplicar un estilo html:

Al hacer la salida del informe a html, veremos que la página resultante aplica ambos estilos (el general y el del control):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//ENhttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset="UTF-8">
<title>Informe de ejemplo</title>
<link rel="SHORTCUT ICON" href="info-26.png"/><style type="text/css">
body{width:803px;font-family:Arial;font-size:10pt;margin-left:94px;margin-right:94px;margin-top:71px;margin-bottom:71px;border:5px dashed green;}
table.ncr{width:803px;border-spacing:3px;}
td.Detail2_item_BIX4Z{vertical-align:top;border:1px dotted green;width:255px;}
td.PH_item_30ROE{width:525px;vertical-align:top;font-size:28pt;}
div.textBIX4Z{width:255px;}

</style>
</head>
<body>
<!-- SECTION: PH -->
<div class="PH">
<table class="ncr section_PH">
<tr class="r_PH_odd"><td class="PH_item_30ROE">Informe de pruebas</td></tr>
</table>
</div>
<!-- SECTION: Detail2 -->
<div class="Detail2">
<table class="ncr section_Detail2">
<tr class="r_Detail2_odd"><td class="Detail2_item_BIX4Z"><div class="textBIX4Z">

<meta name="qrichtext" content="1" /><style type="text/css">
p, li { white-space: pre-wrap; }
</style><div style=" font-family:'MS Shell Dlg 2'; font-size:8.25pt; font-weight:400; font-style:normal;">
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;"><span style=" font-size:x-large; font-weight:600;">Ejemplo de informe HTML: artículos</span></p>
<table border="0" style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px;" cellspacing="2" cellpadding="0">
<tr>
<td>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;">21</p></td>
<td>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;">Sir Rodney's Scones</p>
<p style=" margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; -qt-block-indent:0; text-indent:0px;">$ENDSCAN{} </p></td></tr></table></div>
</div>
</td></tr>
</table>
</div>
<!-- SECTION: PF -->
<div class="PF">
<table class="ncr section_PF">
<tr class="r_PF_odd"></tr>
</table>
</div>
</body>
</html>

Última actualización