Scribd
Upload
29 views2 pages

A1-2 Instructions

This document provides instructions for an assignment to add generic CSS styles to two HTML files for a gardening website. It involves creating a CSS file called "site.css" and linking it to the HTML files. The CSS file contains styles for fonts, colors, and text formatting for various page elements like headings, navigation links, and the footer. Styles include setting font families, sizes, weights, colors, line heights, text transforms, letter spacing, text alignment and text decoration. The expected output applies these basic CSS styles consistently across both HTML files.

Uploaded by

Balineni Venky
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
29 views2 pages

A1-2 Instructions

This document provides instructions for an assignment to add generic CSS styles to two HTML files for a gardening website. It involves creating a CSS file called "site.css" and linking it to the HTML files. The CSS file contains styles for fonts, colors, and text formatting for various page elements like headings, navigation links, and the footer. Styles include setting font families, sizes, weights, colors, line heights, text transforms, letter spacing, text alignment and text decoration. The expected output applies these basic CSS styles consistently across both HTML files.

Uploaded by

Balineni Venky
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

Assignment.1-2 (Chapt.

3 CSS Basics)

This assignment incorporates generic CSS styles (color, font & text) to the website, the expected outputs
of index.html and plants.html are shown below:

Task.1 – create case study folder

Copy the entire case study folder “ggarden1.1” and name the copy as “ggarden1.2”

Task.1 – HTML

1. In both index.html and plants.html, assign an “id” attribute with value “copyright” to the last
<p> element inside <footer>

Task. 2 – CSS

1. Create an external css file “site.css” in the website root folder and use <link> element (inside
<head> section) to associate both index.html and plants.html to “site.css”
2. Font styles:
a. Configure the font family of <h1>, <nav> and <footer> with the fallback typeface values:
"Century Gothic" and “serif”
b. Configure the font family of <h2>, <h3> and <dt> with the fallback values “Gabriola” and
“sans-sefif“
c. For <h1>, set the font size to “3em”, and the font weight to “500”
d. For <h2>, set the font size to “2em”
e. For <dt>, set the font weight to “bold”
f. For <footer>, set the font size to “smaller”
g. For id selector “#copyright”, set font family to “serif” and apply “italic” style
3. Color styles:
a. For <header>, <footer>, set the background color as: “rgb(65,132, 42)”; and set text
color as “#eee”
b. For <h2> and the navigation links, set the text color as: “rgb(35,102, 12)”
c. Set the text color of descendant selector “footer nav a” as: “#eee”

4. Text styles:
a. set up “400%” line height” for <h1>
b. for <h2>, <h3>, <dt> and the descendant selector ““nav a”, apply “uppercase” for “text-
transform” property, and apply “1px” letter spacing
c. for <h1>, <nav> and “#copyright”, align text to “center”
d. set the text decoration of all navigation links (“nav a”) to “none”

You might also like