In the last post, I shared my study note about three basic CSS selectors. Even though I wrote an example under each selector, it still may not enough to explain how those selectors make the effect. Therefore, I am going to explain more detail about how to use those CSS selectors in a simple project. In this project, I will create a short To Do List and then apply element selector, ID selector and class selector to style the list. Step One: Create HTML page As I mentioned before, the first step is always to create HTML page. Without a page, we can't do any CSS work. It is just like we should have a cake ready before to put cream and fruit on it. Here is the To Do List HTML part: It turns out a simple black and white web page. Step Two: Use Element/ID/Class selectors in the CSS file. Element Selector: Firstly, I want to make the web page background to be grey. Since the whole body of the page will be grey, I will use Element selector: body { background: g...