Modifying the HTML
Tour the Existing HTML
- HTML consists of a series of elements, which wrap the content in both an opening and closing tag.
- The
<div>
tags define a division or a section in an HTML document. These allow us to group important elements together and nest elements to create structure and organization.
Explore to Learn:
- What lines of code in the HTML file are responsible for the text displayed in the browser?
- What organizational structures do you notice?
- What might be the purpose of the
class
that appears on some of the elements?
Modify the Existing Code
Now that we're getting to know HTML and this specific project a bit better, let's modify it!
- Update the HTML in the embedded CodePen file below to make it a glossary of terms that we are learning today!
- CSS: Short for Cascading Style Sheets, this language controls the look and feel of a webpage. It can change the layout of items on a page, colors, fonts, and even animate elements!
- JavaScript: This programming language is responsible for user interaction. For example, when the user clicks a button and sees a change in the browser, this action is controlled by JavaScript.
HTML Summary
- We can nest elements inside of other elements to create structure within the HTML.
- Classes allow us to give each element a specific label so that we can reference that element later.
- The number of elements and the content inside of the elements in the HTML file usually have a 1-to-1 correlation with what we see in the browser.