How can CSS be used to format HTML tables generated by PHP in WordPress?

To format HTML tables generated by PHP in WordPress using CSS, you can target the table elements with CSS selectors and apply styles such as padding, borders, font size, and colors. By adding a custom CSS file to your WordPress theme or using inline styles within your PHP code, you can easily control the appearance of the tables. 

// Example PHP code to generate an HTML table in WordPress
echo '<table class="custom-table">';
echo '<tr>';
echo '<th>Name</th>';
echo '<th>Email</th>';
echo '</tr>';
echo '<tr>';
echo '<td>John Doe</td>';
echo '<td>johndoe@example.com</td>';
echo '</tr>';
echo '</table>';
```

```css
/* Example CSS code to style the HTML table */
.custom-table {
  width: 100%;
  border-collapse: collapse;
}

.custom-table th, .custom-table td {
  padding: 10px;
  border: 1px solid #ccc;
}

.custom-table th {
  background-color: #f2f2f2;
  font-weight: bold;
}

.custom-table tr:nth-child(even) {
  background-color: #f9f9f9;
}

.custom-table tr:hover {
  background-color: #e9e9e9;
}

Keywords

PHP CSS HTML tables WordPress formatting

Related Questions