You will create two short html documents and one external CSS file that will be applied to both documents. We can use the same id and class names in both documents and apply the same style to both documents.

Topic for page B1:

How has technology affected the loss of privacy

Topic for page B2:

What has the pandemic done to change Technology and who uses it.

For each page write three paragraphs about the given topic followed by a conclusion paragraph with headings above each paragraph. Google these topics and include your opinions in the third paragraphs.

You can include other headings. Include references using an unordered list of links. (You will only have a few references.) You can also use in-line elements in your page.

Include an h5 at the bottom of both pages that contains todays date, your name, and your section number. Use a local style to make it appear in the color rebeccapurple in lab5B1xx.html and both in the color peachpuff and underlined in lab5B2xx.html.

Applying Style using an External CSS

Note: There cannot be any html in the external CSS; that means no < >; no tags.

1. Open the editor and save your file as lab5Bxx.css in your All_102Submissions folder, where xx are your first and last name initials
2. In the css file use a background image that will tile across the top of the page. (See page 150-151 in the textbook). Note: If your background image is too large you can use background:size. You can look it up on w3schools to find the possible property values.
3. In both of your html documents place a heading on that background that contains your name and give that heading an id (Use the same id in lab5B1xx.html and lab5B2xx.html.)

(Note: You can only use an id once in an html document but you can use the same id in a different document. And apply style to both documents with the external CSS. So you can use the same id in lab5B1xx.html and lab5B2xx.html.

• In your external CSS apply style to that id to:
  1. Delete this line:Make that heading quite large The id will override the class.

dont give it a font-size here

• 2. And give the text a color using the hexadecimal value.
• Be certain that you can see the text with the background that you used. The background image has one heading on it in lab5B1xx.html and one heading on it in lab5B2xx.htmland nothing else on that background image.

4. Apply style to all the paragraphs.
5. Give the first paragraph in lab5B1xx.html an id and give the first paragraph in lab5B2xx.html the same id.

Remember you can only use a particular id once in a document but you can use the same id in another document. Since we are using one external CSS we can use the same id once in each document and apply the same style in both documents for that id.

Set the style for that id in the external CSS.

6. In both lab5B1xx.html and lab5B2xx.html, use one class, (The same class in both documents) in two of the headings and in the conclusion paragraph. You are using one class name in three places in each document. Put this class in the CSS and apply style.
7. Apply style to the h5 to make them all appear in italic.
   1. This was updated changed from h6.You inserted an h5 at the bottom of both pages not an h6.
8. Apply style to other elements such as headings and in-line elements.
9. Use the pseudo class :hover to increase the font size to 44pt when the mouse is over each heading. Hint: Give oneclass to all headings in both documents. (Use the same class in both documents. Use that classname:hover in the CSS with font-size)

NEED CODE WRITTEN