CS521 Assignment 1 Solution Spring 2026

This assignment focuses on styling a university course registration webpage using CSS. You will implement various CSS selectors to manage the layout and appearance of banners, course cards, and registration forms. The task requires demonstrating an understanding of CSS cascading and selector specificity. You must produce a functional webpage that incorporates specific styling techniques as outlined in the requirements.

1. 1

   Element, Class, and ID Selectors

   Apply element selectors for headings and paragraphs across the page. Use class selectors to define the appearance of course cards and their descriptions. Implement an ID selector specifically for the welcome banner at the top of the page.

2. 2

   Attribute Selectors

   Style form inputs using attribute selectors such as input[type="text"] and input[type="email"]. Additionally, use an attribute selector to style registration links that are configured to open in a new tab.

3. 3

   Pseudo Selectors

   Implement :hover effects for navigation links or registration buttons. Use the :nth-child() selector to highlight the second course card. Incorporate the ::after pseudo-element to add decorative content after section headings.

4. 4

   Contextual Selectors

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

5. 5

   CSS Cascading

   Apply multiple CSS rules to the same element using a combination of element, class, and ID selectors to demonstrate cascading. Include CSS comments within your code to explain the specificity and why certain styles override others.

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 Attribute selectors Contextual selectors