Lab 3: HTML5 & CSS3

Before you start with Lab-3, I suggest that you go to these links and make yourself familiar with the CSS format.

• HTML-CSS
• Begin CSS here
• Learn about selectors

1. Download the .zip files on ICON. It has two files viz., css_sheet.css and lab-3-start.html. As you already know, lab-3-start.html has the content of the page and css_sheet.css has the styles using which the html's content will be displayed.
2. Modify the files, to obtain the following styles:

• Use rounded corners and borders on all of the blocking elements. (Rounded border)
• Use 2 different linear gradients as background and change background for every blocking element. (Gradients)
• 3 different hover links. Links should change color when you hover. (Hover)
• Use text shadows on at least 2 pieces of text. (TextShadowGenerator, Text Shadow)
• Change the title (inside the title tag) to your name, change most of the original text.
• Use different colors for a good design. (Colors)
• Transfer the page to MyWeb using Filezilla.
• Extra: (Not mandatory) Insert a video inside a new article on the page. The video should play on the “OnMouseover” event, stop on the “onmouseout” event and resize when the page re-sizes.