Differences

This shows you the differences between two versions of the page.

--- en:web_development:lists:multilevel_lists [2021/11/28 15:20]
mag
+++ en:web_development:lists:multilevel_lists [2023/08/16 09:33] (current)
@@ Line 1: / Line 1: @@
 ====== Web Development Lesson 3 - Lists ======
 ===== Multi-level Lists =====
+==== Objectives ====
+In this exercise you will:
+  * create multi-level lists
+  * start using Visual Studio Code, a professional coding platform
+  * learn one way to target specific elements with CSS
 ==== Setup ====
-  * We'll start from a blank slate, so delete all the HTML and CSS you've entered so far.
+  * We'll start from a blank slate in [[https://jsfiddle.net|jsfiddle]], so delete all the HTML and CSS you've entered so far.
 ==== Nesting Lists ====
@@ Line 96: / Line 101: @@
   * Save that and again open the code in Live Server. It should now have the formatting we added.
-==== Adding Javascript ====
+==== Final Code ====
-  * Add another line in <html><head</html> and type 'script' and select 'script:src'.
+If your code doesn't look quite right or you want to check it against mine, here's what we've been working on.
-  * In this case, we need to define the name of the javascript file. Enter 'lists.js' and save the file.
+  * [[https://techschool.murraygunn.id.au/webdev/classes/lists/2/en.php|lists.html]]
-  * Now, create a file called lists.js and copy the Javascript code from jsfiddle into the file.
+  * [[https://techschool.murraygunn.id.au/webdev/classes/lists/2/style.php|style.css]]
-  * Save that file too and open the live server. Everything should work as it did in jsfiddle, but now in a full screen.
+[[en:web_development:lists:checklists|Next: Checklists]]

Tech School

User Tools

Site Tools

Differences

Page Tools