html 报告页面样式

修改了下HTML页面样式

html 报告页面样式_第1张图片

页面代码

        DOCTYPE html>
        <html lang="en">
        <head>
            <meta charset="UTF-8">
            <title>自动化测试报告title>
            <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
            <h2 style="font-family: Microsoft YaHei">自动化测试报告h2>
            <p class='attribute'><strong>测试结果 : strong> 共 10,通过 9,失败 1p>
            <style type="text/css" media="screen">
        body  { font-family: Microsoft YaHei,Tahoma,arial,helvetica,sans-serif;padding: 20px;}
        td {text-align:center}
        th {text-align:center}
        style>
        head>
        <body>
            <table id='result_table' class="table table-condensed table-bordered table-hover" >
                <colgroup>
                    <col align='left' />
                    <col align='right' />
                    <col align='right' />
                    <col align='right' />
                colgroup>
                <tr id='header_row' class="text-center success" style="font-weight: bold;font-size: 14px;">
                    <th width="25%">客户端及版本th>
                    <th width="25%">通过率%th>
                    <th width="25%">开始时间th>
                    <th width="25%">结束时间th>
                tr>
                
        <tr class='failClass warning'>
            <td > 3.8.8td>
            <td>99td>
            <td>2019-04-17 20:21:27td>
            <td>2019-04-17 20:21:27td>
        tr>
            table>
        
        <p class='attribute'><strong>测试详情 : strong> 执行结果p>    
            <table id='result_table' class="table table-condensed table-bordered table-hover">
                <colgroup>
                    <col align='left' />
                    <col align='right' />
                    <col align='right' />
                    <col align='right' />
                colgroup>
                <tr id='header_row' class="text-center success" style="font-weight: bold;font-size: 14px;">
                    <th colspan="2">业务模块th>
                    <th>用例总数th>
                    <th>通过数th>
                    <th>状态th>
                tr>
                 <tr id='header_row' class="text-center success" style="font-weight: bold;font-size: 14px;">
                    <th width="20%">th>
                    <th width="20%">模块1th>
                    <th width="20%">10th>
                    <th width="20%">8th>
                    <th width="20%"><font color="green">PASSfont>th>
                tr>                           
                
        <tr class='failClass warning'>
            <td>td>
            <td>3.8.8td>
            <td>100td>
            <td>90td>
            <td><font color="green">PASSfont>td>
        tr>
                 <tr id='header_row' class="text-center success" style="font-weight: bold;font-size: 14px;">
                    <th width="20%">th>
                    <th width="20%">模块2th>
                    <th width="20%">10th>
                    <th width="20%">8th>
                    <th width="20%"><font color="#FF0000">Failfont>th>
                tr>                           
                
        <tr class='failClass warning'>
            <td>td>
            <td>3.8.8td>
            <td>100td>
            <td>90td>
            <td><font color="#FF0000">Failfont>td>
        tr>        
        
            table>        
        


        
            
        body>
        html>

 

转载于:https://www.cnblogs.com/lisa2016/p/10730387.html

你可能感兴趣的:(html 报告页面样式)