Search⌘ K
Home
Courses
Web Development: Unraveling HTML, CSS, and JavaScript

Adjusting Text

Explore how to adjust text styling in table columns using CSS. Understand methods to style columns via colgroup classes, cell classes, and nth-child selectors, and how to align text baselines for consistent appearance.

We'll cover the following...

To emphasize textual information in the fish catalog table, the name column should be stronger than the description column.

Styling column text

You have a few ways to style columns.

First, you can assign a class to columns defined for the table. If you open the index.html file, you can see that the table definition contains a <colgroup> definition:

HTML
<table class="fish-table">
    <!-- … -->
    <colgroup>
      <col class="image" />
      <col class="name" />
      <col class="desrc" />
    </colgroup>
    <!-- … -->
</table>

Each <col> definition has an associated class that can be set to define column-specific style attributes.

For example, to define the style for the Name column, add property declarations to the .name rule.

Unfortunately, you can specify only properties that belong to the column ...