How to Format in CSS
Formatting your Cascading Style Sheets (CSS) is how you actually enter your style rules in the document. This format determines where the spaces, indentations, attributes and brackets appear. A good layout allows you to create clean syntax that you can easily navigate, read and modify. Although there are no hard-and-fast rules when it comes to arranging your styles, you can format in CSS using a procedure that is widely accepted.
Other People Are Reading
Instructions
-
-
1
Launch your text editor program, and open your CSS file.
-
2
Enter "/* */" to create CSS comment tags and type a note, such as the section of the page the upcoming styles affect, between these elements. For example:
/* Header */
The comments are not visible on a Web page.
-
-
3
Enter the HyperText Markup Language (HTML) element, ID or class you are styling. Press the space bar to create a space, type an opening bracket that precedes your attribute(s), press the Enter button to make a new line, then enter a closing bracket. To illustrate:
#header {
}
-
4
Position your cursor between the brackets, and enter an attribute with the colon at the end. Press the space bar, type the attribute value and enter a semicolon to complete the declaration. For instance:
#header {
color: #606060;
}
-
5
Create a new line under the first attribute, and enter your information like so:
#header {
color: #606060;
text-decoration: underline;
}
Repeat this process to add as many attributes for this CSS rule as you require.
-
6
Press the Enter button, and repeat the steps to create a new comment tag (if needed) and build a new rule. For example:
/* Header */
#header {
color: #606060;
text-decoration: underline;
}
/* Main Content */
p {
font-size: 12px;
color: #cccccc;
}
-
7
Save your CSS file.
-
1
References
Resources
- Photo Credit Creatas Images/Creatas/Getty Images
