Javascript 多次在表头前打印标题的Html_Javascript_Jquery_Html_Css

Javascript 多次在表头前打印标题的Html

javascript jquery html css

Javascript 多次在表头前打印标题的Html,javascript,jquery,html,css,Javascript,Jquery,Html,Css,下面是html代码的示例。我对html非常陌生。我需要帮助在表格标题之前打印标题。所有标题都打印在下面代码的顶部。请帮忙我需要打印标题QACheck:-NIC1，然后是表头，再次打印标题QACheck:-NIC2，然后是表头，依此类推我在下面的评论中得知，斯科特·马库斯（Scott Marcus）不推荐使用标题我需要的是在表格标题之前，我需要在本例中输入表格的说明QACheck:-NIC1，QACheck:-NIC2，QACheck:-NIC3是表格的说明如果需要更多信息，请告诉我

下面是html代码的示例。我对html非常陌生。我需要帮助在表格标题之前打印标题。所有标题都打印在下面代码的顶部。请帮忙

我需要打印标题QACheck:-NIC1，然后是表头，再次打印标题QACheck:-NIC2，然后是表头，依此类推

我在下面的评论中得知，斯科特·马库斯（Scott Marcus）不推荐使用标题

我需要的是在表格标题之前，我需要在本例中输入表格的说明QACheck:-NIC1，QACheck:-NIC2，QACheck:-NIC3是表格的说明

如果需要更多信息，请告诉我

        <!DOCTYPE html>
        <html>

        <style>
        p {
            font-family : Calibri;
            font-size: 14px;
            font-weight: bolder;
            text-align : left;
        }

        p.fade {
            color : #CCCCCC;
            font-size: 14px;
        }
        em  {
            font-style : italic ;
            font-size : 16px;
            font-weight: lighter ;
        }
        em.pass {
            font-style : italic ;
            font-size : 16px;
            color: green ;
        }
        em.fail {
            font-style : italic ;
            font-size : 16px;
            color: red ;
        }

        a {
            text-decoration: none;
        }
        a:hover {
            text-decoration: underline;
        }

        hr {
            align: left ;
            margin-left: 0px ;
            width: 500px;
            height:1px;
        }

        table {
            border-collapse: collapse;
        }

        tr {
            padding: 4px;
            text-align: center;
            border-right:2px solid #FFFFFF;
        }

        tr:nth-child(even){background-color: #f2f2f2}

        th {
            background-color: #cceeff;
            color: black;
            padding: 4px;
            border-right:2px solid #FFFFFF;
        }


        </style>

        <body> 
            <table>
<caption>QACheck:- NIC1</caption>
<tr>
<th>Parameters</th>
<th> Output</th>
<th> QACheck_Status</th>
<th> Reason</th>
</tr>
<tr>
<td>Device</td>
<td> Alias</td>
<td> ok</td>
<td> NOthing</td>
</tr>
<tr>
<td>Game</td>
<td> CriKet</td>
<td style='color:red'> Failed</td>
<td> "Not Played well"</td>
</tr>
<tr>
</tr>

<caption>QACheck:- NIC2</caption>
<tr>
</tr>
<tr>
<th>Parameters</th>
<th> Output</th>
<th> QACheck_Status</th>
<th> Reason</th>
</tr>
<tr>

<tr>
<td>Device</td>
<td> Alias</td>
<td> ok</td>
<td> NOthing</td>
</tr>
<tr>
<td>Game</td>
<td> CriKet</td>
<td style='color:red'> Failed</td>
<td> "Not Played well"</td>
</tr>
<tr>
</tr>
<caption>QACheck:- NIC3</caption>
<tr>
</tr>
<tr>
<th>Parameters</th>
<th> Output</th>
<th> QACheck_Status</th>
<th> Reason</th>
</tr>
<tr>
<td>Device</td>
<td> Alias</td>
<td> ok</td>
<td> NOthing</td>
</tr>
<tr>
<td>Game</td>
<td> CriKet</td>
<td> Pass</td>
<td> "NA"</td>
</tr>
<tr>
</tr>
</table>

        </body> 
    </html>


p{
字体系列：Calibri；
字体大小：14px；
字体大小：粗体；
文本对齐：左对齐；
}
p、 褪色{
颜色：#中交；
字体大小：14px；
}
em{
字体：斜体；
字体大小：16px；
字体重量：较轻；
}
埃姆通行证{
字体：斜体；
字体大小：16px；
颜色：绿色；
}
失败{
字体：斜体；
字体大小：16px；
颜色：红色；
}
a{
文字装饰：无；
}
a:悬停{
文字装饰：下划线；
}
人力资源{
对齐：左；
左边距：0px；
宽度：500px；
高度：1px；
}
桌子{
边界塌陷：塌陷；
}
tr{
填充：4px；
文本对齐：居中；
右边框：2px实心#FFFFFF；
}
tr:n子（偶数）{背景色：#f2f2}
th{
背景色：#cceeff；
颜色：黑色；
填充：4px；
右边框：2px实心#FFFFFF；
}
QACheck:-NIC1
参数
输出
QAU状态检查
理由
装置
别名
好啊
没有什么
游戏
克里克特
失败
“打得不好”
QACheck:-NIC2
参数
输出
QAU状态检查
理由
装置
别名
好啊
没有什么
游戏
克里克特
失败
“打得不好”
QACheck:-NIC3
参数
输出
QAU状态检查
理由
装置
别名
好啊
没有什么
游戏
克里克特
通过
“不适用”

您尚未关闭表标签 您应该在标题之前打开表标记，在所有tr标记之后关闭它，然后打开其他表

th{
宽度：150px；
}


p{
字体系列：Calibri；
字体大小：14px；
字体大小：粗体；
文本对齐：左对齐；
}
p、 褪色{
颜色：#中交；
字体大小：14px；
}
em{
字体：斜体；
字体大小：16px；
字体重量：较轻；
}
埃姆通行证{
字体：斜体；
字体大小：16px；
颜色：绿色；
}
失败{
字体：斜体；
字体大小：16px；
颜色：红色；
}
a{
文字装饰：无；
}
a:悬停{
文字装饰：下划线；
}
人力资源{
对齐：左；
左边距：0px；
宽度：500px；
高度：1px；
}
桌子{
边界塌陷：塌陷；
}
tr{
填充：4px；
文本对齐：居中；
右边框：2px实心#FFFFFF；
}
tr:n子（偶数）{背景色：#f2f2}
th{
背景色：#cceeff；
颜色：黑色；
填充：4px；
右边框：2px实心#FFFFFF；
}
QACheck:-NIC1
参数
输出
QAU状态检查
理由
装置
别名
好啊
没有什么
游戏
克里克特
失败
“打得不好”
QACheck:-NIC2
参数
输出
QAU状态检查
理由
装置
别名
好啊
没有什么
游戏
克里克特
失败
“打得不好”
QACheck:-NIC3
参数
输出
QAU状态检查
理由
装置
别名
好啊
没有什么
游戏
克里克特
通过
“不适用”

您有许多HTML错误，但最大的错误是您似乎有3个表，但没有关闭前两个表，这导致一个表有3个标题

您有几个空的

tr

元素

您省略了文档的

标题

部分

您的CSS中也有一个错误，您使用了

align

属性，并且应该只使用

边距：0（您已经拥有）：


p{
字体系列：Calibri；
字体大小：14px；
字体大小：粗体；
文本对齐：左对齐；
}
p、 褪色{
颜色：#中交；
字体大小：14px；
}
em{
字体：斜体；
字体大小：16px；
字体重量：较轻；
}
埃姆通行证{
字体：斜体；
字体大小：16px；
颜色：绿色；
}
失败{
字体：斜体；
字体大小：16px；
颜色：红色；
}
a{
文字装饰：无；
}
a:悬停{
文字装饰：下划线；
}
人力资源{
文本对齐：左对齐；
左边距：0px；
宽度：500px；
高度：1px；
}
桌子{
边界塌陷：塌陷；
}
tr{
填充：4px；
文本对齐：居中；
右边框：2px实心#FFFFFF；
}
tr:n子（偶数）{背景色：#f2f2}
th{
背景色：#cceeff；
颜色：黑色；
填充：4px；
右边框：2px实心#FFFFFF；
}
QACheck:-N
  hr {
        /* you had align:left; */
        margin-left: 0px ;
        width: 500px;
        height:1px;
  }