Chapter 3. Building a Card-matching Game in CSS3

CSS3 introduces many exciting features. In this chapter, we will explore and use some of them to create a card-matching game. CSS3 styles how the game objects look and animate, while the jQuery library helps us to define the game logic.

In this chapter, we will:

• Transform a playing card with animation
• Flip a playing card with new CSS3 properties
• Create the whole memory matching game
• Embed a custom web font to our game

You can try the card-matching game at the following URL to have a glimpse of what we are going to achieve in this chapter:

http://makzan.net/html5-games/card-matching/

So, let's get on with it.