TRIN371 – 2017 – HW02 – Indenting, Special characters, Bullets/Numbers, Linking to places on the same html page, quick and easy email, Comments, Beginning table
HTML Code
- From my web page, save file02.html as: username02.html; open username02.html in both Notepad++ and Chrome/Firefox
- In the title: replace SURNAMES; and use special characters to replace the -- with an em dash
- Between the opening body tag and the opening font tag, add a comment that says:
Edited by Name Surname and Name Surname
Use your actual name(s) and surname(s) - If you wish: change the background color and font face, and add a text color
- Between Bilkent University and History, use special characters to add 2 right pointing arrows
- Between Career and Center, add 3 non-breaking spaces
- Replace xxx with your email address, by typing it "wrongly"; keep it centered, but make it bold
- Make the two countries and 7 cities into a bulleted list; the cities should be indented, both on the page and in the code – you can use the default bullets
- Copy the bulleted list, and paste below the 1st list – change this new list so that the countries use A and B, and the cities are numbered a, b, c, d, e, f, and g
- Put a copy of one of the 80% horizontal lines between the bulleted and numbered lists
- Make the 2nd and 3rd paragraphs view as indented paragraphs
- Near the end of the code, make Table be bold; then, below Table and above the closing font tag, enter a table as follows:
- Make a simple table, with a border of 2 pixels and one normal row that has 3 columns
- In the first row, each in one column), type: CITY COUNTRY CONTINENT
- When the row is working correctly, copy it 3 times; that is, you should then have 4 rows – the original row, and 3 new rows
- Change the original row to be a header row
- In the header row only, make each of the 1st two columns be 25% wide
- In the remaining 3 normal rows:
▪In the 1st normal row:AnkaraTurkeyAsia
▪In the 2nd normal row:New YorkUSANorth America
▪In the 3rd normal row:DakarSenegalAfrica
- Add the following attributes for the whole table
▪Cell padding of 5 pixels
▪Cell spacing of 0 pixels
▪Make the table be at the center of the screen, horizontally
▪Width of 700 pixels
▪Height of 250 pixels
- Make "Bilkent University → → History" be a link that jumps to the 1st paragraph (which begins with the words "Bilkent University")
- Make "Career Center" be a link that jumps to the 7th paragraph (which begins with the words "The Career Center") – NOTE: the page may be too short to go all the way to those words – if you want to check it, zoom in (about 150%) before testing