How to Use the ID Selector in CSS
There's lots of talk in CSS programming about IDs, classes, and pseudo-classes, etc. But what does it mean to use an ID? According to CSS tutorials and experts, the ID is an identifier for a specific HTML element that shows up once within a page. The ID is more restrictive than a class in its make-up, but adheres more to HTML convention and fits into an HTML framework in possibly a more straightforward way. Here's how to use an ID for CSS elements.
Instructions
-
-
1
Set up your CSS code space. You can use a stand-alone text file as an external CSS page, or put CSS code in the head of an HTML document. Either way, you need to define a space beyond the HTML to do your CSS coding which will apply to one or more pages.
-
2
Start your ID definition by naming an element within the CSS code space. Start with an HTML element, like p (for paragraph) or h1 (a heading).
-
-
3
Add a hash mark, and then the name or ID after the element. An example: p#graphID1
-
4
Include style directions with commands like this: p#graphID1 {text-color: black; }
-
5
Access your ID. Within your HTML code, start your ID element with a tag that looks like this: p id="graphID1". This will open your HTML for that element.
-
6
Enter the text or other content for the element you've opened. This content should be styled as your CSS commanded when you load the page.
-
7
Close the element with the appropriate tag. You do not need to reference the ID again when closing the element: it's already been identified, defined and constructed. Just put in the regular element closing tag.
-
1