CS521 Assignment 1 Solution Fall 2026

This assignment focuses on styling a university course registration webpage using CSS. You will implement various CSS selectors and demonstrate the principles of CSS cascading to manage styles effectively. The project requires creating a structured layout featuring a welcome banner, course cards, and a registration form. You must apply specific styling techniques to these components to showcase your understanding of CSS rules and selector specificity.

1. 1

   Element, Class, and ID Selectors

   Apply element selectors to format headings and paragraphs across the page. Use class selectors to define the appearance of course cards and their descriptions. Additionally, implement an ID selector specifically for the welcome banner.

2. 2

   Attribute Selectors

   Style form input fields by targeting their specific types using attribute selectors. Also, use an attribute selector to target and style registration links that are configured to open in a new browser tab.

3. 3

   Pseudo Selectors

   Implement hover effects for navigation links or registration buttons using the :hover pseudo-class. Use the :nth-child() selector to apply unique styling to the second course card. Finally, use the ::after pseudo-element to insert decorative content after section headings.

4. 4

   Contextual Selectors

   Utilize descendant or child selectors to target elements nested within the course section. Apply sibling selectors to style paragraphs that appear immediately after a course heading.

5. 5

   CSS Cascading

   Demonstrate cascading behavior by applying multiple conflicting rules to the same element using different selector types. Include CSS comments within your code to explain the resulting style overrides based on selector specificity.

What to submit

One ZIP file containing a folder with index.html and styles.css.

Topics covered

CSS selectors CSS cascading Selector specificity Pseudo-classes Pseudo-elements Attribute selectors Contextual selectors