• Home
  • Health
  • Software
  • Blog
  • css

    Selecting By Class

    index.html:

    <html>
      <head>
        <title>CSS Overview</title>
        <link rel="stylesheet" type="text/css" href="styles.css">
      </head>
      <body>
        <h1>Hello, world!</h1>
        <p>This is my HTML page.</p>
    
        <div class="non_unique_div_class">Div1</div>
    
        <div class="non_unique_div_class">Div2</div>
    
        <div class="non_unique_div_class">Div3</div>
    
      </body>
    </html>
    


    Notice the above HTML. The class is shared between three elements. If we want to apply a style to all three of those, we can use the class. We use the dot (.) to select a class, instead of the hash (#) which we would use to select an ID.


    style.css:

    .non_unique_div_class {
      background: blue;
      color: white;
    }