MSK Institute • Shikohabad
Loading Page Content...
Preparing courses, live labs, and learning resources.सामग्री लोड हो रही है, कृपया प्रतीक्षा करें...
Connecting serverPlease wait...
💻 Practical Labs🚀 Free Demo📜 Verified Certificates
Preparing courses, live labs, and learning resources.सामग्री लोड हो रही है, कृपया प्रतीक्षा करें...
Welcome to Chapter 4: HTML Comments!
Imagine you are studying for your school exams with a friend. While reading your Science textbook, you use a light pencil to write small notes in the margins:
Those pencil notes are meant for you and your study partner, not for the examiner.
In web development, HTML Comments work in the exact same way! They are helpful notes written directly inside your code file by you (the developer).
The web browser (like Google Chrome or Microsoft Edge) completely ignores comments. They are never displayed visually on the webpage!
An HTML comment always starts with <!-- and ends with -->:
<!--): Less-than sign < + Exclamation mark ! + Two hyphens --.-->): Two hyphens -- + Greater-than sign >.You can write comments on a single line or span them across multiple lines:
Used to briefly explain what a specific tag or button does:
Used for longer explanations, author credits, or project outlines:
Why does every professional developer write comments? Here are the three main reasons:
When a website grows to 200 or 500 lines of code, it becomes hard to find where the header ends and where the gallery starts. Comments act like road signboards:
Suppose you created a new button or an image on your webpage, but it has a bug and looks ugly. You don't want to delete your hard-typed code because you want to fix it later.
Simply comment it out!
The browser will skip the button completely as if it doesn't exist, but your code remains safely saved in your file for later!
Ctrl + / ⚡You do NOT have to type <!-- and --> by hand every time!
In Visual Studio Code, there is a one-touch magic keyboard shortcut:
Ctrl + / on Windows (or Cmd + / on Mac).Ctrl + / again, and it will immediately un-comment it!Ctrl + / to comment out the entire block in 1 millisecond!Many beginner students think:
🚫 NEVER DO THIS!
Comments are invisible on the screen, but they are 100% public to anyone who visits your website!
If a user right-clicks anywhere on your webpage and clicks "View Page Source" (or presses Ctrl + U), the entire raw HTML file opens up—including every single comment you wrote!
Always remember: Anyone with an internet connection can read your HTML comments. Keep them clean and professional.
// or `/ /`):*// for comments.// This is my heading, the browser does NOT treat it as a comment. It will literally print // This is my heading right on the screen!<!-- ... --> in HTML.-->):<!-- and forget to close it with -->, the browser assumes everything below it until the end of the file is a comment!The browser will stop at the first --> and break the rest of your code.
<!-- comment here -->.Ctrl + / to comment or uncomment any line instantly.Test your understanding with these multiple-choice questions:
index.html in VS Code.<p>School reopens on Monday.</p>.Ctrl + / on that paragraph to hide it.Ctrl + S) and verify in the browser that the paragraph disappears!Ctrl + / again to bring it back! 🚀In the next lesson, we will continue your web development journey with HTML Colors & RGB (Colors).
Continue learning with hands-on practice, examples, and exercises in the upcoming topic.
| Previous Lesson | Next Lesson |
|---|---|
| HTML Entities, Symbols & Emojis | HTML Colors & RGB |
Test your understanding of this lesson with 5 questions. Each question has one correct answer.