5.1: Lorem HTML

Add another section

Open index.html and add another section, this time for this "Lorem" portion of the webpage - again, we need to give the section an ID attribute so the link in our header will work.

<section id="lorem">
  <h3>Lorem Ipsum</h3>

</section>
Lorem Section

Now let's add 3 paragraphs with some filler text. "Lorem Ipsum" is dummy text used to represent a normal distribution of letters and words - ready more about it herearrow-up-right. Let's use this Lorem Ipsum generatorarrow-up-right to generate a few paragraphs of content. Copy and paste 3 of the paragraphs from the generated text into some <p> tags in our HTML file. (Or copy the paragraphs below)

Lorem Text

Add some classes

We haven't used CSS classes yet in this project - let's practice by adding some CSS classes to these paragraphs. We'll target these paragraphs via this "lorem" class.

Lorem Classes

The finished product should look like this:

Lorem Result

Next Section

We should style these paragraphs a little. Go to 5.2: Lorem CSS.

Last updated