I am going through the HTML tutorial and I'm clueless here

HTML-CSS
1

I am learning html and came across a snipet of code that I haven’t seen before. I was hoping someone could explain it. In particular:

.all-browsers > h1, .browser {
  margin: 10px;
  padding: 5px;
}

I don’t understand what the class .all-browsers > mean when there is an angular bracket before h1, and .browser. The full code is below.

<style>
.all-browsers {
  margin: 0;
  padding: 5px;
  background-color: lightgray;
}

.all-browsers > h1, .browser {
  margin: 10px;
  padding: 5px;
}

.browser {
  background: white;
}

.browser > h2, p {
  margin: 4px;
  font-size: 90%;
}
</style>

So what does the > mean when between two classes declarations?

2

It means that you want to select all h1 whose parent element has class all-browsers

3

Is there another way to write this code to get the same results?

4

If you change the html…sure.

For eg, you can give these specific elements their own class.

5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.