Question

我有一个动态表，可以从数据库中获取数据。

我希望工具提示显示在$row['The_Job']中的列。但与此同时，重要的是此列对单元格内的数据（不是工具提示）具有某种样式。我已在下面添加了CSS .job-styling。

    <?php
  $sql = "SELECT * FROM request_data;";
  $conn = Connect();
  mysqli_set_charset($conn,'utf8');
  $result = mysqli_query($conn, $sql);
  $resultCheck = mysqli_num_rows($result); //<td class="job-style">'.$row['The_Job'].'</td> 

  if ($resultCheck > 0) {
    while ($row = mysqli_fetch_assoc($result)) {
        echo '<table style = "width:100%">
                <tr>
                  <td style = "width:13%">'.$row['ID'].'</td>
                  <td class="job-style">'.$row['The_Job'].'</td>
                  <td style = "width:8%">'.$row['Paymentfro'].'-'.$row['Paymentto'].'</td>
                  <td style = "width:8%">'.$row['Amount'].'</td>
                  <td style = "width:10%">'.$row['Urgency'].'</td>
                  <td style = "width:8%">'.$row['Difficulty'].'</td>        
                </tr>
              </table>';
    }
  }

?>


.job-style {
            max-width:100px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

我该怎么办？我应该添加什么CSS以及如何更改php代码？

Answer 1

HTML title属性表示用于鼠标悬停的工具提示的文本。因此，您需要工具提示，例如在<td>元素中，请包含title="tooltip text"。 Tha显示内置（浏览器）工具提示，这些工具提示不具有样式。

对于您在评论中稍后引用的其他自定义样式工具提示，您的代码应该看起来更像这样（为简洁起见，我只包含您指出需要工具提示的单元格）：

<td class="job-style">
    <div class="tooltip">'.$row['The_Job'].'
        <span class="tooltiptext">Tooltip text</span>
    </div>
</td>

如何在html中的表格单元格内制作工具提示

1 个答案: