With CSS3 declarations you can add animated effects to your Web pages without relying on third-party technologies. You can define transition rules to determine how an element should change appearance, for example when the user hovers their mouse over it. By combining transition rules with CSS3 transforms, you can increase the level of complexity in these interactive effects. In this tutorial we will try out the essential features of CSS3 transitions. Create a Web Page Start by creating the following Web page, with a style section for CSS in the page head and a heading element containing some dummy text in the body section: The style section contains some initial styling for the page. We will use the transition and some transforms to change the way the heading element appears when the user hovers their mouse over it. You can apply transitions to changes in element appearance when particular events occur, detecting these events in JavaScript – we will just use the :hover selector in this tutorial for simplicity. Apply Initial Styling Let’s give the heading initial style properties. Add the following to your style section: Notice that we color the heading text to match the background – this means […]