All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

Single Line Comment In CSS

Last Updated : Mar 11, 2024

Single Line Comment In CSS

In this tutorial we will show you the solution of single line comment in css, as we know css used to style html elements, here we used css internal method to style <p> tag defined in body block and another style can’t work on second <p> tag because we comment that line so that line will avoided by default.

We can use this comment as instruction about code block for developer or we can use to avoid some code from execution.

Step By Step Guide On Single Line Comment In CSS :-

Here we used internal style method and in our program we defined two para <p> tags for display some texts on webpage.

Both <p> tag defined with id attribute and using id’s of ‘#one,#two’ we styles our p tag texts with ‘red’ color but first p tag line only will display in red color because we commented second p tag id ‘#two’ style.

For comment single line or multiline we have same syntax (i.e) /*start with and ends with*/ that symbols we can omit them from execution of program.

<!DOCTYPE html>
<html>
    <head>
        <title>SINGLE LINE COMMENT</title>
        <style>
            #one{
                color: red;
            }
            /* #two{ color: red;} */
        </style>
    </head>
    <body>
        <p id="one">Hi! everyone welcome to our website</p>
        <p id="two">if your remove the comment symbol on style this line color also changed</p>
    </body>
</html>
  1. <!DOCTYPE html> tag which is instruct the web browser about what version of HTML file written in.
  2. The<html> tag is used to indicate the beginning of HTML document.
  3. As above shown <head> tag is containing information about webpage and if you need any external file those links are declared here. <title> tag is used for set the webpage title.
  4. Here we defined styles of sets text color to red using ‘color’ property in css. We defined that style for id ‘#one,#two’ will refers <p> tags from body block.
  5. When we defining style used id or class of particular element we have to use respective symbols ‘.(dot)-refers class attribute’ and ‘#(hash)-refers id attribute’ before name of id or class attribute.
  6. Both <head> and <title> tags having their pair end tag, so we need to close the ending tags respectively. If you’re not closed anyone of ending tag properly that is also affect the webpage result.
  7. <body> tag is beginning of main coding part because it contain coding of entire website blocks and elements described here.
  8. Here we defined two para <p> tags with some texts it will display on webpage when we load on browser.
  9. Both </body>,</html> tags closed respectively. </body> tag indicates the end of body, Then </html> tag indicates the end of HTML document.

Conclusion :-

In conclusion we are able to know single line comment in css. When user loads this on browser we defined two <p> tag will display but one text line only had red color style and another line not have red color style on that because we comment that line when we written program.

So it will omit when we execute and we can use comment any code or text to avoid from execution of program.

I hope this tutorial on single line comment in css helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Dikshita

Passionate Electronics and Communication Engineering student with expertise in web development (HTML, CSS, JS,PHP, Bootstrap, React.js) and content writing. Eager problem solver and tech enthusiast, adept at creating engaging web experiences.

Follow Dikshita On Linkedin 🡪