Download presentation
Presentation is loading. Please wait.
1
From now on you are the Creator,
HTML From now on you are the Creator, Not the USER!!!
2
The Colour Challenge 1 HTML/CSS colours are defined using a hexadecimal (hex) notation for the combination of Red, Green, and Blue color values (RGB). The lowest value that can be given to one of the light sources is 0 (hex 00). The highest value is 255 (hex FF). Colours!!! With a twist!!! Hex to Decimal
3
Learning Objectives To understand the use of websites and identify the good areas and any areas that would need improvements in a website. To be able to create a website using the basic HTML tags.
4
CodeAcademy go to the following website using Google Chrome and sign up: You will need your login details. Will be working from the HTML course. 15 mins.
5
The First HTML Webpage (Notepad)
7 mins <html> <head> <title>My webpage</title> </head> <body> <p>Hello, my name is …. </p> </body> </html> To Save: File > Save As. type mywebpage.html as your file name. To Open: Find your saved “mywebpage” file and double click.
6
Adding some style 7 mins Go back to your notepad document and add the following tags: Makes your text bold <strong> </strong> Makes your text italic <i> </i> Makes your text underlined <u> </u> From now on to Save: File > Save.
7
Using the Heading tags In between the <body> tags insert the following code: <h1> HAPPY NEW YEAR </h1> <h2> HAPPY NEW YEAR </h2> <h3> HAPPY NEW YEAR </h3> <h4> HAPPY NEW YEAR </h4> <h5> HAPPY NEW YEAR </h5> Ext. You can add a marquee to make text animate – <marquee> Text goes in here </marquee> From now on to Save: File > Save.
8
www.w3schools.com/html/html_colors.asp The Colour Challenge 2
Click ME!!!
9
Adding colour to your page
Changes the PAGE COLOUR and text colour <body bgcolor="#000000" text=“#00ffcc"> Changes your colour of the HEADING 1 TAG <h1><font color=“#FFCC00”> hello </font></h1> Changes the colour of your TEXT for that particular <p> <p><font color=“#FFCC00”> hello </font></p> Click me for more colours!!!
10
Image <TAG> Find an image from the internet and save it in the same folder as your webpage. <img src ="APS.jpg" width="366" height="84"> This will resize the image Name of the image and the file type for it recognise it as an image.
Similar presentations
