IDs are used to uniquely identify and style elements in HTML. They provide a more specific way of selecting elements compared to class selectors. An ID selector is represented by the hash symbol (
#) followed by the ID name.
In the above example, we selected the
div element with an ID of
header and applied a background color of
#333, white text color, and a padding of
IDs are unique, so they should only be used once per HTML document. Using the same ID multiple times can lead to invalid HTML, and the styles applied may not behave as expected.
IDs selectors have higher specificity compared to type and class selectors. But be careful with the overuse of IDs in your CSS, as it can lead to specificity issues and make it difficult to style elements in the future.
On line 11 of index.html, inside the
h1 opening tag and after the class attribute, add an
id with the value
Navigate to style.css. Add a ruleset using the ID selector to target the
main-title ID. Inside of its curly braces, write the declaration:
You'll see the title change to a cursive font bringing some beauty and elegance to the page! Okay, maybe not so much. But the font does change.
Sign up to start coding
Already have an account?