So, our webpages are pretty cool. We understand that every web page on Planet Earth has a structure that we must use.
All of our tags go inside the body section of the web page.
Some tags include:
|body||tells us where the body section starts and ends|
|h4||even smaller subheading|
|p||normal paragraph text|
|img||used to place an image on the web page|
But our pages are a little bland. Wouldn't it be great if we could do this:
<p style = " ">Hello</p>
<p style = "color:blue;">Hello</p>
Wow! We have just styled our webpage element, defined by the <p> tag!
Notice the structure of the style:
We can string styles together:
color:blue; opacity:0.7; font-size:14px;
Can you see the 3 styles?
Any tag can be styled. This kind of styling is called inline styling.
|style name||sample values|
|color||red yellow pink #ff0000|
|font-size||8px 24px 200%|
|font-family||arial chiller courier new|
|opacity||0 1 0.6 0.8|
|background||blue green #f0f0f0|
|text-align||center justify right|
Follow these steps to create a webpage about Tokyo in Japan.
First, let's set up a project folder for Focus 5.
Download this html file and save it in your project folder.
Follow these instructions carefully.
Here are some useful phrases you can use in Tokyo.
Do you have any more ideas? Add more content and/or style your page as you like. Don't forget to use W3 Schools for ideas!
Submit your project folder as instructed by your tutor.