简体   繁体   English

DataTables jQuery,CSS中的背景色不起作用

[英]DataTables jquery, background color in CSS doesn't work

I've tried some solutions, but still it doesn't works. 我已经尝试了一些解决方案,但是仍然行不通。 I'm trying to display data from database in table, using jQuery DataTables plugin. 我正在尝试使用jQuery DataTables插件在表中显示数据库中的数据。 Technically everything is OK, but the background color of some rows doesn't work. 从技术上讲,一切正常,但是某些行的背景色不起作用。 What's wrong? 怎么了?

<html lang="pl">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.16/css/jquery.dataTables.css">

    <title>Football stats</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>
    <script>
        $(document).ready(function(){
            $('#table1').DataTable();
        });
    </script>
</head>
<?php
$polaczenie = new mysqli('localhost','root','','mecze');
$sql = 'MY SELECT';
$wynik = $polaczenie->query($sql);

echo '<body>
<table id="table1">
<thead>
<tr>
<th>ID</th>
<th>Hour</th>
<th>Country</th>
<th>Team</th>
<th>Ov 2,5</th>
<th>Avg</th>
<th>Ov 1,5ht</th>
<th>LG HT</th>
<th>LG FT</th>
<th>LG</th>
<th>EOver</th>
<th>EAvg</th>
<th>EOvHT</th>
<th>EHt</th>
<th>EFt</th>
<th>ELate</th>
<th>SUMAvg</th>
<th>H2HOver</th>
<th>H2HGAvg</th>
<th>H2HOvHt</th>
</tr>
</thead>';

echo '<tbody>';
while (($rekord=$wynik -> fetch_assoc()) != null)
{
    $explode = explode("/", $rekord['home']);
    echo '<tr>';
    echo '<td>'.$rekord['id_match'] . '</td>';
    echo '<td>'.$rekord['hour'] . '</td>';
    echo '<td>'.$explode[2] . '</td>';
    echo '<td>'.$explode[3] . '</td>';
    echo '<td>'.$rekord['over'] . '</td>';
    echo '<td>'.$rekord['goalsavg'] . '</td>';
    echo '<td>'.$rekord['overht'] . '</td>';
    echo '<td>'.$rekord['lategoalht'] . '</td>';
    echo '<td>'.$rekord['lategoalft'] . '</td>';
    echo '<td>'.$rekord['lategoal'] . '</td>';
    echo '<td>'.$rekord['EOver'] . '</td>';
    echo '<td>'.$rekord['EAvg'] . '</td>';
    echo '<td>'.$rekord['EOvHT'] . '</td>';
    echo '<td>'.$rekord['EHt'] . '</td>';
    echo '<td>'.$rekord['EFt'] . '</td>';
    echo '<td>'.$rekord['ELate'] . '</td>';
    echo '<td>'.$rekord['SUMAvg'] . '</td>';
    echo '<td>'.$rekord['H2HOver'] . '</td>';
    echo '<td>'.$rekord['H2HGAvg'] . '</td>';
    echo '<td>'.$rekord['H2HOvHt'] . '</td>';
    echo '</tr>';
}
 echo '</tbody>';
 echo '</table>';
?>

There's how it should looks like: https://datatables.net/examples/basic_init/zero_configuration.html 它看起来应该像这样: https : //datatables.net/examples/basic_init/zero_configuration.html

My rows are not highlited.. 我的行没有高亮显示。

<table id="table1" class="stripe" cellspacing="0" width="100%">

from here . 这里 If you want on-hover styling you may have to give some javascript. 如果要悬停样式,则可能需要提供一些JavaScript。 Read more about styling here . 在此处阅读有关样式的更多信息。

Add class="display" to your table. class="display"添加到表中。 For example: 例如:

<table id="table1" class="display" width="100%" cellspacing="0">

See styling classes for more information. 有关更多信息,请参见样式类

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM