creating web page

profileHAPPY123
BasicHTMLFall20171.doc

BA2123 Fall 2017

Assignment 2: HTML Basics – Due: Refer to the class schedule on the D2L

Part I. Study the first 16 videos at the lesson 1 of “Intro to HTML/CSS basics” at Udacity.com

You need to visit https://www.udacity.com and sign in (you need to register for the first time).

Then choose the course (https://www.udacity.com/course/ud304 ) and click “Access Course Materials” to watch the videos for free. Watch the first 16 videos in the first lesson (HTML, CSS, and Boxes) Answer the following questions.

image1.png

1. Observing Wikipedia’s page and structure, which of the following are true.

(a) All elements are visible

(b) All elements are rectangular

(c) You can read the same text as on the page

2. In the quiz: page structure, you will see a quiz. What are the answers for the box 3 and 4 in the video?

3. If you uncheck the border-radius in the right lower screen below, what would happen?

image2.png

(a) The circle will disappear

(b) The circle will become a square

(c) The circle will shrink

4. Which of the following are possible value for the font-style property in CSS?

(a) Italic

(b) Normal

(c) Standard

5. What property in CSS would you use to make the text look “bold”?

Part II. Creating a Web page (HTML file)

Open a text file with a text editing program, such as Notepad (To invoke a Notepad program, click "Start" in the Window, click "All programs," select "Accessories," and click "Notepad").

Type the text below (on the left side).

image3.emf

<html><head><title>BA2123 HTML Example 2</title></head><body><basefont color="black" face="arial" size="4">Introduction to e-commerce.<br><br><font color="Blue" face="arial" size="2"><b>My name is John Doe and my student number is 036400.</b></font><br><br>My favorite cities.<ol start="4"><li>Saint John</li><li>Vancouver</li><li>New York</li></ol><br><br>My Favorite Sports.<table border=1 ><tr> <td >Tennis</td> <td>Golf</td> </tr><tr> <td>Baseball</td> <td>Soccer</td> </tr></table></body></html>

image4.png

Save this file as "HTMLsample.htm".

If you open it with the Chrome browser (or Internet Explorer), you will see a web page similar to the one above (on the right side). You may search Google to understand meaning of HTML tags (e.g. <title>, <br>, <ol>, <tr>, and <td>)

1. If you replace <title>BA2123 HTML Example 2</title> with <title> ABC </title>, where on the web page would ABC appear if you open the file using the Chrome browser?

2. The list of my favorite cities starts with 4. If you want to starts with 9 instead of 4, what tag do you need to change? Revise the tag and write it as an answer.

3. What is the meaning of <tr> </tr>?

4. What is the meaning of <td> </td>?

5. We want to add one more column (e.g. swimming, dancing) to the table (My Favorite Sports). Revise the code below and write them as an answer.

<table border=1>

<tr> <td>Tennis</td> <td>Golf</td> </tr>

<tr> <td>Baseball</td> <td>Soccer</td> </tr>

</table>

The revised webpage would be a web page similar to a image here (image5.png

Print your answers for Part I and II and bring them to the class as a hard copy (please note that you do not have to hand in the webpages that you created.)

(This is an individual assignment and worth 3 % of your total mark.)