Keeping things Clean in HTML and CSS

Sometimes HTML and CSS can get messy, but learning how to organize your html and CSS can save you from a lot of trouble.

First lets start with your HTML.

* Note to see the images, click to them to enlarge the photo.*

Navigation Bar HTML

It is always good to put your Navigation bar in a div so it doesn’t get mixed up with the rest of your html. Also, If you want to design it in your CSS it will have it’s own section.

nav bar ish

Navigation Bar in CSS

In your CSS it is good to name you class or Id a name that best describes the element your are attributing.

In my CSS I labeled my class for the “navbar”, so it’s easy to recognize.

nav bar ish

Making Comments in HTML.

Sometimes you want to make comments in your HTML with out actually making a code. If that ever is the case you do the following.

<!— Write comment here   —>

( You can’t see it well but the code is a < ! and two dashes ; the text;  two dashes and then a > )

Anything written inside of that window is not seen on the website.

Making Comments in CSS.

In your CSS to make a comment you do the following.

/*  Write comment here  */

Comments are helpful to title different sections or to write notes about code you have to do later.


Make you space out your code appropriately so its easy to read.

With these general rules your HTML and CSS will be very organized!

~ by catchmeonfifth on February 3, 2013.

%d bloggers like this: