Learn CSS Selectors the fun way!


Learning CSS isn't an easy task - after getting the basic structure down, learning advance things can get difficult. One of the most important part of CSS are selectors. Targeting specific elements is a very important part of creating designs and mastering selectors is very important for that reason.

Now after a while, CSS can get boring and most people just skip learning advance selectors all together. Well recently I found a really fun way to learn and practice CSS selectors - from the basic ones all the way to the advance ones.

Meet CSS Diner



CSS Diner is a website created by Luke Pacholski(@flukeout). Upon arriving at the site you're greeted with a nice "diner-style" page with a table set with plates and everything. Below that is a little text-editor area where all the magic happens. There are two columns- on the left side is a CSS Editor and on the right side is the HTML viewer. The concept is pretty simple - look at the elements on the right and use CSS selectors to select them on the left. If you're stuck, just have a look at the example/instructions on the right.

It's pretty simple and fun. You start off with the simple tag selector and work your way up to the more advance child selectors as you go through the 26 levels. This, in my opinion, is a really fun way to learn CSS Selectors that everyone should try out. :))

Hey there, I'm Ammar!

Share This Post

Comments

10 comments:

  1. Very best people messages are meant to charm allow honor toward groom and bride. Newbie speakers in front of excessive locations should usually our own gold colored dominate in presenting and public speaking, which is to be personal interests home. best man speach web design manhattan

    ReplyDelete
  2. Woh I enjoy your articles , saved to favorites ! . web design new york

    ReplyDelete
  3. I dont leave a lot of comments on a lot of blogs each week but i felt i had to here. Do you need many drafts to make a post? new york web designs

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. Must tow line this caravan together with van trailer home your entire family fast get exposed to the issues along with reversing create tight placement. awnings nyc web designer

    ReplyDelete
  6. The author covered some curious points here. I came across this by using Yahoo and I must confess that I am currently subscribed for your blog, it is quite great web design new york

    ReplyDelete
  7. This comment has been removed by the author.

    ReplyDelete
  8. Nice one, there is actually some great facts on this post some of my subscribers may find this useful, will send them a link, many thanks. branding sf

    ReplyDelete
  9. Finally, got what I was looking for!! I’ve really enjoying every small bit of this. Ecstatic I stumbled into this post! and also I’ve bookmarked to look at unique information for your blog post. branding agency sf

    ReplyDelete
  10. This is a very exciting article, I’m looking for this know how. So you understand I established your web site when I was searching for sites like my own, so please look at my web site someday and post me a opinion to let me know how you feel. san francisco design agency

    ReplyDelete