Cadbury World Themed Web Page

Size: px

Start display at page:

Download "Cadbury World Themed Web Page"

Lillian Cameron
6 years ago
Views:

We have already used HTML tags to construct a simple web page using an editor to create a list of favourite things.

1 Cadbury World Themed Web Page HTML Creating Your Own Web Page more advanced What have we learnt so far? HTML is used to instruct readers such as web browsers how to present, process and/ or describe the look of web page. We have already used HTML tags to construct a simple web page using an editor to create a list of favourite things. Let s examine the code you have seen so far: Let s now expand our knowledge, use the skills we have already learnt and use new tags and HTML code to create our own webpage based on the school topic. Your challenge is to create a web page based on Cadbury World You need to include: All the correct starting and finishing code to ensure the web page knows what to do. All the correct start and finish tags when required. Formatted text. (size, strong, underlined, colour) Paragraphs and lined breaks Text explaining what the web page is all about A list Images Marquee (scrolling) Links to other web sites. To help with the challenge, use the code above as a starting point and modify it suite your needs. Open the explorer seach engine and type Tryit which will give you the editor. Also click on the glossary of code link you will be taken to the w3schools.com HTML tutorial site which gives all the HTML code. As you have limited time during a normal lesson to speed things up, you will find below a useful selection of code that will help you with your challenge. Cut paste and modify as required. Remember, all code should be placed between the <body> </body> tags.

2 ONLY COPY BLUE TEXT Backgrounds <body style="background-color:lightgrey"> (changes the background colour) Other possible colours: lightgreen, lightblue, lightyellow, try others but you need to be able to see the text and pictures) Text effects <u>underlined text</u> (underlines everything between the tags) <small>example of small text</small> (makes text small) <p><i>this text is italic.</i></p> (Text in the paragraph is italics) <h1 style="color:blue">this is a heading</h1> (changes text between h1 tags to blue) <p style="color:red">this is a paragraph.</p> (changes text between P tags to blue) Formatting <p>write your text here</p> (new paragraph) <br> <hr> (new line for text or all text will be joined together does not need a closing tag) (draws a line across the page does not need a closing tag) <center>this text will be center-aligned </center> (Centers text) Lists <ol> </ol> <ul> <ul> (numbered lists see favourites example of how to add things to a list) (bullet pointed list unordered)

3 Scrolling (adds a scrolling picture with a message) <MARQUEE> Visit Cadbury World! <img src=" not available" width="150" height="150"/> </MARQUEE> Link to a chocolate production website <a href=" Production</a> Link by clicking an image to the Cadburys World Website <p><i> Click Logo for website</i></p> <a href=" target= _blank > <img src=" </a>

4 Here is Example code template to help with your Cadburys World visit themed web page can you adapt it? ONLY COPY BLUE TEXT <!DOCTYPE html> <html> <body> <center><h1 style="color:blue">title of web page</h1> </center> (below is an image source you can delete this and copy code for other images see bottom of document) <img src=" alt="picture not <p><strong><h3>title of list to follow</h3><strong></p> <hr> hr draws a line <h3 style="color:red"> (this is the size and colour of the text in the list) <ol> (start of list) </ol> (end of list) </h3> (end of size tag) <hr> <br> (br means break leave a space) <br> <strong>closing caption</strong> </body> </html>

Some Chocolate facts you may find your own Chocolate is made from Cocoa beans

Cadbury World has 14 amazing zones Cadbury World is home to the World s biggest

5 Some Chocolate facts you may find your own Chocolate is made from Cocoa beans Cocoa beans grow in pods on trees Cadbury World is in Bournville, Birmingham Cadbury World has 14 amazing zones Cadbury World is home to the World s biggest Cadbury Shop <img src=" alt="picture not <img src=" alt="picture not <img src=" alt="picture not <img src="

6 <img src=" <img src=" <img src=" <img src=" <img src=" <img src=" alt="picture not <img src=" alt="picture not <img src=" <img src="

recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML)

HTML & Web Pages recall: a Web page is a text document that contains additional formatting information in the HyperText Markup Language (HTML) HTML specifies formatting within a page using tags in its