Get a step-by-step guide on setting up class files for our Web Development tutorial, including detailed instructions for both Mac and Windows users.
This exercise is excerpted from Noble Desktop’s HTML & CSS training materials and is compatible with Flexbox, Grid, and Bootstrap updates through 2023. To learn current skills in HTML & CSS with hands-on training, check out our Front-End Web Development Certificate, Full-Stack Web Development Certificate, and coding classes in-person and live online.
Complete the following setup prior to beginning any exercises.
Topics Covered in This Web Development Tutorial:
Setting up Your Class Files
Creating Your Own Copy of Class Files
Throughout this workbook you will be editing class files that we have prepared for you. Instead of editing the originals, we’ll have you make a copy just for yourself to edit.
- If you have any windows open, minimize or hide them so you can see the Desktop.
- Open the Class Files folder.
-
Follow the appropriate Mac or Windows instructions below:
Mac:
- Click once on the Flexbox Grid Class folder to select it.
- Press Cmd–D to duplicate it.
- Rename the duplicate folder yourname-Flexbox Grid Class.
Windows:
- Click once on the Flexbox Grid Class folder to select it.
- Press CTRL–C to copy it.
- Press CTRL–V to paste it.
- The new copy may be at the bottom of the list of folders. Rename it yourname-Flexbox Grid Class.
You now have your own set of class files to use throughout the class. Have fun!
