Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member

What is a comment?

From: CSS: Visual Optimization

Video: What is a comment?

One of the easiest ways to let people know exactly what's going on inside of your CSS documents is to use something called a Comment. And you might not know exactly what a Comment is or how to write one, and so that's what we're going to talk about in this movie. What exactly is a Comment? So, I'm going to start off with a black CSS document, so let's go to File, New CSS, and you can create a new CSS document in whatever code editing application you happen to be using, it doesn't have to be this exact one. And so I'm just going to start off by typing out the body tag here and then on the second line I'm just going to define something like the font-size and then after that we're going to do something like 62.5%.

What is a comment?

One of the easiest ways to let people know exactly what's going on inside of your CSS documents is to use something called a Comment. And you might not know exactly what a Comment is or how to write one, and so that's what we're going to talk about in this movie. What exactly is a Comment? So, I'm going to start off with a black CSS document, so let's go to File, New CSS, and you can create a new CSS document in whatever code editing application you happen to be using, it doesn't have to be this exact one. And so I'm just going to start off by typing out the body tag here and then on the second line I'm just going to define something like the font-size and then after that we're going to do something like 62.5%.

And so, after I type out 62.5%, some people might not understand exactly what that means. 62.5% of what exactly are we defining here? And so I need to put something in here that explains to the layperson exactly what this means. And so in order to that I need to insert something called a Comment, this is code that is not going to be interpreted by the browser, it's actually ignored by the browser, and it's only visible to people who view the CSS document itself. And so, in this case, to start a comment you just do a slash, and you do a little asterisk like this, and you would do something like 1em is equal to 10px and then we'll close that with an asterisk and a slash like this.

And so basically, in this case, this comment lets someone reading the CSS file know that that particular line of CSS was intended to allow free using ems to set the font size later in the CSS in a more intuitive base 10 type of way. And so, hopefully somebody will understand that and will read into that from that comment that I produced right there. You can also do this for something like colors as well, so if you wanted to define a color for this text like #333, and if somebody doesn't understand what color that is that's okay, you can just do a slash, and you could do something like dark grey just to let them know what the color is and so if they chose to change it, they would know, oh okay, I'm changing the color from dark grey to something else.

So these little comments are actually very useful for determining things like this. And so, in essence, when you work on comments, this is a great way to sort of road map where you're going and also a great way to add in little bits of information regarding the code that you've inserted into your CSS documents and let people understand exactly what you were going for in this markup.

Show transcript

This video is part of

Image for CSS: Visual Optimization
CSS: Visual Optimization

25 video lessons · 6921 viewers

Justin Seeley
Author

 

Start learning today

Get unlimited access to all courses for just $25/month.

Become a member
Sometimes @lynda teaches me how to use a program and sometimes Lynda.com changes my life forever. @JosefShutter
@lynda lynda.com is an absolute life saver when it comes to learning todays software. Definitely recommend it! #higherlearning @Michael_Caraway
@lynda The best thing online! Your database of courses is great! To the mark and very helpful. Thanks! @ru22more
Got to create something yesterday I never thought I could do. #thanks @lynda @Ngventurella
I really do love @lynda as a learning platform. Never stop learning and developing, it’s probably our greatest gift as a species! @soundslikedavid
@lynda just subscribed to lynda.com all I can say its brilliant join now trust me @ButchSamurai
@lynda is an awesome resource. The membership is priceless if you take advantage of it. @diabetic_techie
One of the best decision I made this year. Buy a 1yr subscription to @lynda @cybercaptive
guys lynda.com (@lynda) is the best. So far I’ve learned Java, principles of OO programming, and now learning about MS project @lucasmitchell
Signed back up to @lynda dot com. I’ve missed it!! Proper geeking out right now! #timetolearn #geek @JayGodbold
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

Please wait... please wait ...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

Join now "Already a member? Log in

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed CSS: Visual Optimization.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Are you sure you want to delete this note?

No

Your file was successfully uploaded.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.