Q:

html multiple class in one label

<table class="table table-striped">
        <thead>
            <tr>
                <th>#</th>
                <th>Firstname</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>Anna</td>
            </tr>
            <tr>
                <td>2</td>
                <td>Debbie</td>
            </tr>
            <tr>
                <td>3</td>
                <td>John</td>
            </tr>
        </tbody>
</table>

it's a snippet from a bootstrap example.
noticed that it has multiple class in one label, so what's the relationship between these two class? it seems that table-striped is a subclass of table?
And how will the css change the style of this element? Will the style of table-striped override the style of table?
further more, how should I select this element by class?

A:

I see you are still learning stuff here, If I am going to suggest it is far more better for learning sake to stay away from frameworks first until you learn how the basic stuff works, jumping ahead will just cause complications. Though anyway:
The classes you have mentioned does not have a relationship at all, actually all CSS classes do not have relationship at all. They stand out on their own for example:
.table {
  border: 1px solid black;
  width: 100%;
  // other common properties you find in a table
}

and there the other goes:
.table-striped {
  border: 1px dashed black;
  // other properties you can find on a striped table
}

as you invoke table-striped in a table that contains table class table-striped will just override the common properties of table which is border and apply it to the element.
How does it override? It is something I call precedence in CSS, whichever style comes last is always applied though later on you will encounter CSS overrides do not apply at all IF selectors do not match.
And the last thing: it does not matter how are you going to select the class as:
.table {
   // stuff
}

.table-striped {
   // stuff
}

// if selector contains both classes
.table.table-striped {
   // stuff
}

// if a table element contains .table class
table.table {
   // stuff
}

// and so on...

do not matter at all. Hope that helps you understand.

