User:Daniel.heffernan

Coder dojo 25/2/12 HTML class

1. Start off with your basic html page with: Heading Paragraph goes here

2. Try editing the title of the page with the e.g. :: Welcome to our demo

3. All of the HTML you write should be in the and brackets.

4. Next you can try adding in boxes to your page. The boxes aren't visible when you put them in, but using cololurs you can show their outlines. The boxes are put in by putting script in the brackets.

5. Now the boxes are there open some  brackets. In the brackets you can change the colour of your page with the colour commands such as: body { background-color: green; background-image:url('IMG_0068.jpg'); }

6. After playing around with the pages colour and putting in pictures with the background-image:url('') command above we added in jquery. You can get this as www.jquery.com. download the script page and save it in the same folder as your page.

7. Add this line just under the bracket of your page: 

This adds in a jquery search box or something.

8. We kept at the page and by the end my page looked like this:



 $('#box1').click( function { alert($('#tb1').val); } ); welcome to out Demo

body { background-color: green; background-image:url('IMG_0068.jpg'); } background-color: blue; }
 * 1) box1 {

background-color: red; } background-color: green; } Heading Paragraph goes here  this is another paragraph.
 * 1) box2 {
 * 1) box1 p {