Learning Goal #6
Students will be able to design a collection of original websites with creative section elements managed through an external, cascading style sheet.
PART 1: Deadlines
Read More
Below are your deadlines for Learning Goal #6: Mastering the Box Model with CSS3. If you complete approximately 1.5 lessons per week, you should be able to keep up with the deadlines.
- April 12, 2019:
5 Lessons Complete (6.1 through 6.5) - May 3, 2019:
6 Lessons Complete (6.6 through 6.11) - TO BE DETERMINED (May 2019):
ICT Final Exam (Web Essentials) - May 6, 2019 through May 28, 2019:
LG6 Final Project
REMINDER: In order to earn an A for each lesson, you need to complete each assignment within the lessons. At the end of each lesson, you will take a short quiz on eCampus and confirm that you have done all the assignments. If you only do some of the assignments, you can still do okay, but it is in your best interest to complete them all. Your grade depends on how much you get done within the time you are given.
PART 2: Overview
Read More
The last lesson was probably the hardest assignment you’ve done all semester. Which means that it’s time to go through a much simpler challenge and an easier concept to understand. Something called “visiblity.” Did you know that it’s possible to create something in your design, but then make it invisible on the page? This lesson is about learning how to work with the visibility factor in a design. Enjoy!
Below are some helpful tips and resources that you can use during and after this lesson is over.
CSS Style Tips to Remember
- With HTML, you learned that elements are either block level (meaning they fall down to their own line) or inline level (meaning they stay in the same line as the previous element). With CSS, you can use the display property to change block level elements (like div, p, etc) into inline level elements and inline elements (like a, span, etc) into block level elements.
- The visibility property is a great way to hide certain elements of a page and see what the page actually looks like without them.
- When using the visibility property, the collapse value is only useful with tables. With “collapse” you can basically make an entire cell go away (like it was never there).
- The display property can also be a way to make elements disappear by coding with display:none
PART 3: Assignments
Read MoreAssignment #1 (1 Point): SoloLearn Video Lessons
Log into your SoloLearn account and find the Course called CSS Fundamentals. Inside of this course, watch the following lessons (you will need your headphones), but when you finish, be sure to make note of how many SoloLearn points you have earned. Points are based on how many sections you complete and how many questions you answer correctly after each section.
- The Display Property
- The Visibility Property
Assignment #2 (2 Points): Design Project
Open up 10 of your previous HTML assignments (doesn’t matter which ones) from Learning Goal #5 or #6 and make an important element invisible in all of them. For example, you might go back to your Varosha page and make one of the blocks disappear. But here’s the catch… If you make something invisible, it has to hold its position. In other words, if something is invisible, the space where it would normally show up must still exist.
Assignment #3 (1 Point): Review and Quiz
Look over the 6.6 Review Sheet. Read over the vocabulary terms. Look over the questions. Make sure you know how to answer each question. Then go to eCampus, find the quiz for Lesson 6.6, and take it. This is a way for you to show the teacher that you have finished this lesson.
If you have finished the assignments in this lesson, you will need a new password so that you can enter Lesson 6.7. Feel free to ask the teacher and don’t be afraid to raise your hand or go up to ask. If you are actually finished with a lesson, you will get an answer.