This is Sasha and thanks for joining me here for another CSS training video. In this video, I want to share with you how you can modify and edit your business website and add in some CSS commenting. Let’s take a quick look.
Why to use comments?
Let’s say you’re creating a website and you’re looking to edit your website or you’re building a web page. What you may want to do in your CSS is add in some code so that way if you add in some code you actually have some comments within that code. That way just makes things a lot easier for you to understand what’s going on and what’s happening underneath the surface.
If let’s say you have this class that’s red for the paragraph and you could say right here, this is red, we’ll make the color also red and here let’s just take a quick look. There we go. There’s our red color and then we’ll go ahead and do this, this will be our class title and we’ll go ahead and create a title class right here and we’ll make the color let’s say green. Okay? Here you could see we have a red text right there and we also have a green title.
--------------------- HTML CODE --------------------------------------- CSS CODE ------------------ p.red { font-family: arial; font-size: 18px; line-height: 1.65; color:red; } .title {color:green;}Backstageincome : Learn to grow a business and evolve your life! Business Launch Pad is focused on showing you the critical concepts on how to build a profitable business from scratch.These are my books and products
Thank you for visiting
HTML vs. CSS comments
If you want to add in some comments and as things become a little more complicated, the way to add a comment in CSS is slightly different than HTML. HTML comments look something like this.
But in CSS, they don’t really work because the syntax is slightly different. The way you do it is you add a / within CSS with an *and then type your comment and then you close it again like that with a closing * and then another /. You kind of wrap those things up.
--------------------- HTML CODE --------------------------------------- CSS CODE ------------------ body {background: #fff;} /* Type your comment*/ p.red { font-family: arial; font-size: 18px; line-height: 1.65; color:red; } .title {color:green;}Backstageincome : Learn to grow a business and evolve your life! Business Launch Pad is focused on showing you the critical concepts on how to build a profitable business from scratch.These are my books and products
Thank you for visiting
Some people style these a little bit different or nicer so they may go ahead and do something like this and add in a comment like that so now you have one of these comments. Other people may go and do something completely different. They might do something like this. As long as the syntax follows the rules and properties, you’re okay and you’re good to go. This is a comment there.
--------------------- HTML CODE --------------------------------------- CSS CODE ------------------ body {background: #fff;} /*------------------- Type your comment* -----------------/ /******************** Type your comment ********************/ p.red { font-family: arial; font-size: 18px; line-height: 1.65; color:red; } .title {color:green;}Backstageincome : Learn to grow a business and evolve your life! Business Launch Pad is focused on showing you the critical concepts on how to build a profitable business from scratch.These are my books and products
Thank you for visiting
you could also say, “Okay. Well, here’s our title.” You could type a comment like this and if I just expand this a little further, so here is our title so you could do something like that and then there you go. Some people write out long comments in this manner. Okay? Everybody has their own ways and their own styles of commenting things.
--------------------- HTML CODE --------------------------------------- CSS CODE ------------------ body {background: #fff;} /*------------------- Type your comment* -----------------/ /******************** Type your comment ********************/ p.red { font-family: arial; font-size: 18px; line-height: 1.65; color:red; } /*----------------- Here is our title --------------------*/ .title {color:green;}Backstageincome : Learn to grow a business and evolve your life! Business Launch Pad is focused on showing you the critical concepts on how to build a profitable business from scratch.These are my books and products
Thank you for visiting
You know, if you like to just keep them short and to the point, you could ultimately just go ahead and type your / or ////, you have your * and then type in your comment and then close it off with another * and another / to end that comment, and there you go, that’s a comment.
The other cool thing about comments within CSS is since you have these lines or multi-lines that are being created, you could type them in right here such as this is for the font. You say, “Okay. This is for internet explorer.” For some CSS comments, you’re adding it in because of internet explorer and then you might add those things right under it.
--------------------- HTML CODE --------------------------------------- CSS CODE ------------------ body {background: #fff;} /* Type your comment */ p.red { font-family: arial; /* this is for the font */ font-size: 18px; line-height: 1.65; /* this is for internet explorer */ color:red; } /*----------------- Here is our title --------------------*/ .title {color:green;}Backstageincome : Learn to grow a business and evolve your life! Business Launch Pad is focused on showing you the critical concepts on how to build a profitable business from scratch.These are my books and products
Thank you for visiting
You could do it within actually those rules and properties as well to add in your comments and all of these will work just fine. If I hit save, there’s nothing that really is changed within the code but ultimately that is how you do it. That way you can reference your code a little bit better or easier as you’re reading through it especially as you have lines and lines of code.
