CSS Comments

Exercise

  1. In the "index.html" file, replace the code with the following:
      <!DOCTYPE html>
      <html lang="en">
      <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>CSS</title>
        <link rel="stylesheet" href="./css/styles.css">
      </head>
      <body>
        <h1>CSS Intro</h1>
        <p>This is my first time using CSS</p>
        <p>CSS makes the website look good</p>
        <p>List of things I'm learning</p>
        <ul>
          <li>HTML</li>
          <li>CSS</li>
        </ul>
        <a href="https://www.google.com">Link to Google</a>
      </body>
      </html>
  1. Save.
  2. If "Live Server" is not already running, right-click anywhere in the editor and select "Open with Live Server" from the context menu.
  3. In the "styles.css" file, add the following code:
      h1 {
      color: blue;
      }
  1. Save.
  2. In the "styles.css" file, add a comment above the h1 selector and some comments inside the declaration area so that it looks like the following:
      /* This is a comment in CSS */
      h1 {
        /* Commenting out the color blue */
        /* color: blue; */
        color: red;
      }
  1. Save.
  2. In the browser, you should see the following:

    3. Exercise 2 Result

Code Walkthrough and Explanation


/* This is a comment in CSS */

In CSS, comments are used to add annotations or explanations within the stylesheet code. They allow you to document your code and make it easier for others to understand and maintain. Comments are ignored by the browser and do not affect the styling of the web page. You can add comments on a single line or multiple lines. Adding comments to your CSS code can help you keep track of important information about your styles or temporarily disable certain styles for testing purposes.


Experiment with the Code


Video and Code References


Questions? Subscribe and ask in the video comments:



GitHub and Other References