0:00
Hey Troopers, what's going on? I'm Sean from The Net Ninja and this is CSS for Beginners
0:11
Lesson 7, CSS Comments. So before we go any further with this course, I just wanted to
0:17
go through comments and how we use comments in CSS. Now, they can be used for a variety
0:23
of things. They can be used to make notes for yourself, so you remember to add certain
0:27
styles, they can be used to split your CSS file up into logical areas, loads of different
0:33
things and basically it's a way of adding text to a CSS file without the browser looking
0:38
at that text and doing anything with it, so it's not going to screw up your page. Okay
0:43
so the syntax of a comment is pretty simple. All we do is put a forward slash, then we
0:48
put this asterisk sign to open a comment and you can see now everything is greyed out here
0:54
and this is being construed as a comment by the CSS file. Now to close the comment
0:59
we do an asterisk again and a forward slash again and you can see everything has come
1:04
back in colour here because we've closed the comment up here and this is no longer within
1:08
it. So we could say here, style all p tags and then below here is where we're going to
1:17
do all our p tags, so we could have another one, header p, give this a rule and we'll
1:25
make this font size, I don't know, 24 pixels and then basically we've just said all p tags
1:32
are here. Now here we could say, I don't know, open a comment, style all header tags and
1:40
close the comment and then we'll do h1 font size is, I don't know, 44 pixels. So basically
1:54
what I've done here is I've used comments to segment my CSS file. So that's one use
2:00
of comments. Now you just have to be careful that you always end your comments here because
2:06
if you don't then all your CSS below it until we find this ending comment is going to be
2:13
excluded and it's not going to be rendered this way in the browser. So you need to be
2:17
really careful that you always put this asterisk at the end. So another use for the comment
2:23
is to comment out segments of rules. Say for example that you no longer want the header
2:30
p here to be rendered in a higher font size, you could temporarily comment that out by
2:36
opening our comment and then closing it. That will no longer apply in the browser. So you
2:44
can have various different rules in between here and you want to disable them for an unspecified
2:48
amount of time. But when you want to re-enable them again you just come here, delete your
2:53
comments and voila, it's back again and it's not going to be ignored anymore. Another example
3:00
of where we'd use comments is at the start of a CSS file a lot of people like to put
3:05
their personal details at the top. So I'd do this. And I'm just going to put a load
3:10
of asterisks, it makes like a border. And one again, one again, do a space and then
3:17
I'll do something like author, Sean aka the net ninja. I don't know, course, no, date
3:30
date, we'll do date, another date, I think it's the 3rd of June, 15. You know, you get
3:38
the point. Anyway, you can put your details here and then at the very end close the comment
3:44
off. So all these asterisks here, they're just kind of being used to make a border at
3:49
the top and the bottom and the side. And we've gone on to multiple lines by doing different
3:55
specifications in here, the author and the date, etc. You can put whatever you want in there. And then finally we've closed the comment off at the end with the forward backslash
4:01
Not the forward backslash, that makes no sense, the forward slash. So yeah, I mean, there's
4:07
a variety of different ways we can use comments. I just wanted to show you them now in case
4:11
I use them in the future. Also, you can use them in your style sheets going along so you
4:15
can organize them a bit better. Obviously, if you have any questions about this, feel
4:19
free to comment below and I'll answer all of those. Otherwise, I'll see you guys in the next movie
