CIT Level 4 Professional Skills Blog: September 2016

Blog Task 28

<!DOCTYPE html>
<html>
<body>

<img src="http://www.bbc.co.uk/staticarchive/e8c03c8f235e08297ddc886f6516edb9f4679357.jpg" alt="Planets" usemap="#planetmap" style="width:500px;height:200px;">

<map name="planetmap">
<area shape="rect" coords="0,0,70,200" alt="Sun" href="https://en.wikipedia.org/wiki/Sun">
<area shape="circle" coords="85,105,2" alt="Mercury" href="https://en.wikipedia.org/wiki/Mercury_(planet)">
<area shape="circle" coords="95,105,4" alt="Venus" href="https://en.wikipedia.org/wiki/Venus">
<area shape="circle" coords="105,105,4" alt="Earth" href="https://en.wikipedia.org/wiki/Earth">
</map>

</body>
</html>

Blog Task 27

<!DOCTYPE html>
<html>
<body>

<img src="http://www.bbc.co.uk/staticarchive/e8c03c8f235e08297ddc886f6516edb9f4679357.jpg" alt="Planets" usemap="#planetmap" style="width:500px;height:200px;">

<map name="planetmap">
<area shape="rect" coords="0,0,70,200" alt="Sun" href="http://nineplanets.org/images/thesun.jpg">
<area shape="circle" coords="85,105,2" alt="Mercury" href="http://apod.nasa.gov/apod/image/9612/mercury2_mariner10_big.gif">
<area shape="circle" coords="95,105,4" alt="Venus" href="https://upload.wikimedia.org/wikipedia/commons/8/85/Venus_globe.jpg">
<area shape="circle" coords="105,105,4" alt="Earth" href="http://solarviews.com/raw/earth/bluemarblewest.jpg">
</map>

</body>
</html>

Blog Task 26

<!DOCTYPE html>
<html>
<body>

<img src="https://media.giphy.com/media/7Q3wQQbgbOB2g/giphy.gif" alt="Husky in the snow GIF" style="float:above;width:400px;height:225px">

</body>
</html>

Blog Task 25

Exercise 1:
<!DOCTYPE html>
<html>
<body>

<p>print "Hello World!"</p>

</body>

</html>

Exercise 2:

<!DOCTYPE html>

<html>

<body>

<h1>This is a Heading</h1>

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>

<p>This is another another paragraph.</p>

</body>

</html>

Exercise 3:

<!DOCTYPE html>

<html>

<body>

<p>

My Bonnie lies over the ocean.</br>

My Bonnie lies over the sea.</br>

My Bonnie lies over the ocean.</br>

Oh, bring back my Bonnie to me.</br>

</p>

</body>

</html>

Exercise 4:

<!DOCTYPE html>

<html>

<body>

<pre>

<p>

My Bonnie lies over the ocean.

My Bonnie lies over the sea.

My Bonnie lies over the ocean.

Oh, bring back my Bonnie to me.

</p>

</body>

</html>

Blog Task 24

Exercise 1:
<!DOCTYPE html>
<html>
<body>

<h1>London</h1>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants. Tis the place of tea n' crumpets too.</p>

</body>

</html>

Exercise 2:

<!DOCTYPE html>

<html>

<body>

<h1>London</h1>

<hr>

<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants. Tis also the place of crumpets n' tea</p>

</body>

</html>

Exercise 3:

<!DOCTYPE html>

<html>

<body>

</body>

</html>

Exercise 4:

<!DOCTYPE html>

<html>

<body>

<h1>Universal Studios Presents</h1>

<h2>Jurassic Park</h2>

<h3>About</h3>

<p>On the Island of Isla Nublar, a new park has been built: Jurassic Park is a theme park of cloned dinosaurs!!</p>

</body>

</html>

Blog Task 23

Exercise 1:
<!DOCTYPE html>
<html>
<body>

<img src="programming.gif" alt="Typing Man"
width="96" height="96">

</body>

</html>

Exercise 2:

<!DOCTYPE html>

<html>

<body>

<img src="html5.gif" alt="HTML5 Icon (enlarged)"

style="width:256px;height:256px">

</body>

</html>

Exercise 3:

<!DOCTYPE html>

<html>

<body>

<a href="http://www.w3schools.com"><img src="smiley.gif" alt="HTML tutorial"

style="width:42px;height:42px"></a>

</body>

</html>

Exercise 4:

<!DOCTYPE html>

<html>

<body>

<p>

<img src="smiley.gif" alt="Smiley face"

style="float:left;width:42px;height:42px">

A paragraph with an image.</br>

A paragraph with an image.

</p>

</body>

</html>

Exercise 5:

<!DOCTYPE html>

<html>

<body>

</body>

</html>

Exercise 6:

<!DOCTYPE html>

<html>

<body>

</body>

</html>

Blog Task 20

Exercise 1:

<!DOCTYPE html>

<html>

<body>

<a href="http://www.w3schools.com">Visit the HTML programming tutorial.</a>

</body>

</html>

Exercise 2:

<!DOCTYPE html>

<html>

<body>

<a href="html_images.asp">HTML Images Hosted on the main site</a>

</body>

</html>

Exercise 3:

<!DOCTYPE html>

<html>

<body>

<a href="html_images.asp" target="_blank">HTML Images (opens a new window)</a>

</body>

</html>

Exercise 4:

<!DOCTYPE html>

<html>

<body>

<a href="html_images.asp" target="_blank" style="text-decoration:none;">HTML Images (without the underline)</a>

</body>

</html>

Exercise 5:

<!DOCTYPE html>

<html>

<body>

</body>

</html>

Monday, 12 September 2016