intro-to-web-dev/lab6.html at main · CodeNextAdmin/intro-to-web-dev · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!--
CSS:  Classes and IDs

The style-lab6.css file is already started for you. There are two class selectors for two
color options: .red and .blue. These are here mainly as examples, but you may wish to
use them. There is also a #title id selector, as well as the img and body elements.
There is also a quote span.

This lab6.html file you will see some <span> </span> tags, with classes set to "person"
and "thing".  Notice also that there is a last paragraph with a class="source" attribute.
Each paragraph is preceded by an h3 subheading tag.

Your tasks:
1. Change the person and places on the doc to display as different colors, and make bold.
2. Use the id selector to style the title
3. Change fonts. Give all the headings the same font, different from the paragraphs
4. The source at the bottom should be smaller than the regular paragraphs, and a lighter color
5. Make the quote stand out with margins, color, etc
6. Add some new classes and IDs and play around with this page. Make stuff up, it's ok

-->

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Lab 6 - Classes and IDs </title>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <!-- import the webpage's stylesheet -->
    <link rel="stylesheet" href="style-lab6.css" />
  </head>
  <body>
    <h1 id="title" class="red">Ada Lovelace</h1>
    <img src="https://upload.wikimedia.org/wikipedia/commons/a/a4/Ada_Lovelace_portrait.jpg"/>

    <h3>
      Overview
    </h3>
    <p>
      <span class="person">Augusta Ada King</span>, Countess of Lovelace (née
      Byron; 10 December 1815 – 27 November 1852) was an English mathematician
      and writer, chiefly known for her work on
      <span>Charles Babbage's</span> proposed mechanical general-purpose
      computer, the <span class="thing"> Analytical Engine</span>. She was the
      first to recognise that the machine had applications beyond pure
      calculation, and published the first algorithm intended to be carried out
      by such a machine. As a result, she is widely regarded as the first to
      recognise the full potentialof computers and one of the first computer
      programmers.
    </p>

    <h3>
      Ada's Family
    </h3>
    <p>
      <span class="person">Augusta Byron</span> was the only legitimate child of
      poet <span class="person">Lord Byron</span> and his wife Lady Byron. All
      of Byron's other children were born out of wedlock to other women. Byron
      separated from his wife a month after Ada was born and left England
      forever four months later. He commemorated the parting in a poem that
      begins,
      <span class="quote">
        "Is thy face like thy mother's my fair child! ADA! sole daughter of my
        house and heart?".
      </span>
      He died of disease in the
      <span class="thing">Greek War of Independence</span> when Ada was eight
      years old. Her mother remained bitter and promoted Ada's interest in
      mathematics and logic in an effort to prevent her from developing her
      father's perceived insanity. Despite this, Ada remained interested in
      Byron, naming her two sons Byron and Gordon. Upon her eventual death, she
      was buried next to him at her request. Although often ill in her
      childhood, Ada pursued her studies assiduously. She married
      <span class="person">William King</span> in 1835. King was made
      <span class="thing">Earl of Lovelace</span> in 1838, Ada thereby becoming
      <span class="thing">Countess of Lovelace</span>.
    </p>
    <h3>
      Ada's Contemporaries
    </h3>
    <p>
      Her educational and social exploits brought her into contact with
      scientists such as
      <span class="person"
        >Andrew Crosse Charles Babbage, Sir David Brewster, Charles Wheatstone,
        Michael Faraday</span
      >, and the author <span class="person">Charles Dickens</span>, contacts
      which she used to further her education. Ada described her approach as
      "poetical science" and herself as an "Analyst (& Metaphysician)".
    </p>
    <h3>
      Teenage years
    </h3>
    <p>
      When she was a teenager, her mathematical talents led her to a long
      working relationship and friendship with fellow British mathematician
      Charles Babbage, who is known as "the father of computers". She was in
      particular interested in Babbage's work on the
      <span class="thing">Analytical Engine</span>. Lovelace first met him in
      June 1833, through their mutual friend, and her private tutor, Mary
      Somerville.
    </p>

    <h3>
      Accomplishments
    </h3>
    <p>
      Between 1842 and 1843, Ada translated an article by Italian military
      engineer <span class="person">Luigi Menabrea</span> on the calculating
      engine, supplementing it with an elaborate set of notes, simply called
      <span class="thing">Notes</span>. These notes contain what many consider
      to be the first computer program—that is, an algorithm designed to be
      carried out by a machine. Other historians reject this perspective and
      point out that Babbage's personal notes from the years 1836/1837 contain
      the first programs for the engine. Lovelace's notes are important in the
      early history of computers. She also developed a vision of the capability
      of computers to go beyond mere calculating or number-crunching, while many
      others, including Babbage himself, focused only on those capabilities. Her
      mindset of "poetical science" led her to ask questions about the
      Analytical Engine (as shown in her notes) examining how individuals and
      society relate to technology as a collaborative tool.
    </p>

    <h3>
      Death
    </h3>
    <p>
      She died of uterine cancer in 1852 at the age of 36.
    </p>

    <p class="source">
      Adapted from :
      <a href="https://en.wikipedia.org/wiki/Ada_Lovelace">Wikipedia</a>
    </p>
  </body>
</html>