Part $1$: Web Design Techniques$1.$

Float and Clear $(10$ points$)$:

Configure float to create a two$-$column page layout.

Implement clear to ensure proper alignment of floated elements$\mathrm{.}2.$

Two$-$Column Page Layout $(15$ points$)$:

Design a webpage with a two$-$column layout using float.

Ensure that content flows smoothly within the columns$\mathrm{.}3.$

Vertical Navigation $(10$ points$)$:

Create a vertical navigation menu using an unordered list.

Apply appropriate styling to the navigation menu$\mathrm{.}4.$

Horizontal Navigation $(10$ points$)$:

Implement a horizontal navigation menu using an unordered list.

Style the menu to display horizontally across the top of the webpage$\mathrm{.}5.$

Interactivity with CSS Pseudo$-$classes $(15$ points$)$:

Add interactivity to hyperlinks using CSS pseudo$-$classes such as :hover, :active, and :visited.

Ensure that hyperlinks change appearance when hovered over or clicked$\mathrm{.}6.$

CSS Sprites $(10$ points$)$:

Configure CSS sprites to optimize loading time by combining multiple images into a single image file.

Use CSS to display specific portions of the sprite image as background images for elements$\mathrm{.}7.$

CSS for Print $(10$ points$)$:

Configure CSS styles specifically for printing purposes.

Ensure that the printed version of the webpage is well$-$formatted and legible$\mathrm{.}8.$

Positioning Techniques $(20$ points$)$:

Experiment with fixed, relative, absolute$,$ and sticky positioning to understand their differences and commonuses.

Use z$-$index to control the stacking order of positioned elements$\mathrm{.}9.$

Hyperlink to Named Fragment $(10$ points$)$:

Configure a hyperlink to navigate to a named fragment within the same webpage.

Implement smooth scrolling to the named fragment using CSS or JavaScript$\mathrm{.}10.$

Single Page Website $(15$ points$)$:

Design and implement a single page website incorporating the techniques learned above.

Ensure seamless navigation between sections of the webpage.