https://techschool.murraygunn.id.au/wiki/ 2026-04-12T14:12:16+00:00 https://techschool.murraygunn.id.au/wiki/ https://techschool.murraygunn.id.au/wiki/lib/tpl/dokuwiki/images/favicon.ico text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:arrays&rev=1692203632&do=diff Web Development Lesson 4 - Tables Javascript Multidimensional Arrays Objective We'll continue building our table of stats on the Colombia team, but we'll do it more efficiently with javascript by using arrays and loops. Setup * In your 'project' directory, create a file called 'team.html'. text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:content&rev=1692203632&do=diff Web Development Lesson 4 - Tables Table Content and Structure Objective In this section, we'll create a table to present the statistics for the Colombian Football team. You will learn how to structure a table in rows and columns and to assign cells as headings. text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:css&rev=1692203632&do=diff Web Development Lesson 3 - Tables Cascading Style Sheets (CSS) Setup * We'll continue using the the work you've done in jsfiddle until now. * Since you've probably lost the work while doing the exercise, here it is again. <h1 style="font-family:arial, sans-serif; color: green; font-size: 1.7em; text-decoration: underline; font-variant:small-caps; text-shadow:2px 2px #ff0000;"> My Story </h1> <p style="text-align:right"> My friend Pablo has a <em style="color:red; font-weight:700">pet dog… text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:exercise&rev=1692203632&do=diff Web Development Lesson 4 - Tables Exercise Objectivo In this exercise you will create a table yourself using the HTML you have learnt. You will also create the same table using Javascript. Setup * For this exercise, use your 'tables.html' file in your main directory. text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:padding&rev=1692203632&do=diff Web Development Lesson 4 - Tables Padding Objective In this activity we'll adjust the spacing between cells and within cells to make it more readable. Setup * Continue using 'tables.html' and 'style.css' with your code from the previous activity. It should look like this. text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:selectors&rev=1692203632&do=diff Web Development Lesson 3 - Tables Selectors Objective In this activity, we'll look at selectors, which allow you more control over what CSS rules are applied to. Setup * We'll build on previous work in this activity using your 'tables.html' and 'style.css'. Here's the code again. text/html 2023-08-16T09:33:52+00:00 Anonymous (anonymous@undisclosed.example.com) https://techschool.murraygunn.id.au/wiki/doku.php?id=en:web_development:tables:summary&rev=1692203632&do=diff Web Development Lesson 4 - Tables Summary In this lesson we have learnt the following concepts relating to tables in HTML and arrays in Javascript. HTML Tags * table * thead * tbody * tr * th * td HTML Attributes * id * class CSS * font-style * background-color * border-width * border-style *