Elements and Structure Flashcards
Define HTML.
HTML (HyperText Markup Language) is used to give content to a web page and instructs web browsers on how to structure that content.
What is the content of an HTML element?
The information between the opening and closing tags.
What are the opening and closing tags for an HTML element?
- Opening: <h1>
- Closing: </h1>
What are the opening and closing tags for a list item element?
- Opening: <li>
- Closing: </li>
What are list item elements created inside of?
- Ordered Lists ( <ol> )
- Unordered Lists ( <ul> )
What are the opening and closing tags for an ordered list element?
- Opening: <ol>
- Closing: </ol>
What are the opening and closing tags for an unordered list element?
- Opening: <ul>
- Closing: </ul>
What are the opening and closing tags for a video element?
- Opening: <video
- Closing: </video>
What does the <video element do?
It embeds a media player for video playback.
What attribute within the <video element contains the URL to the video?
src
EXAMPLE: <video src=”link”
What attribute within the <video element displays video controls in the media player?
controls
EXAMPLE: <video></video>
Where is the content that shows as a fallback in browsers that don’t support the <video element?
Inside the opening and closing tab
EXAMPLE:
<video>Video Not Supported</video>
What are the opening and closing tags for the emphasis element?
- Opening: <em></em>
- Closing: </em>
Which list element creates a list of items in sequential order?
The Ordered List Element <ol>
Each list item appears numbered by default.
What element is used as a container that divides an HTML document in sections?
The Div Element
<div>
</div>
What are the opening and closing tags for the div element?
- Opening: <div>
- Closing: </div>
What content can the div element contain?
Flow content such as heading, paragraphs, links, images, etc.
How is HTML organized?
HTML is organized into a family tree structure. HTML elements can have parents, grandparents, siblings, children, grandchildren, etc.
What makes up an HTML attribute?
- Name
- Value
Syntax: name=”value”
What are the opening and closing tags for a line break element?
- Opening: <br></br>
- Closing: must not have a closing tag
Where is a line break especially useful?
Where a division on test is required, like in a postal address.
What are the opening and closing tags for an image element?
- Opening: <img></img>
- Closing: must not have a closing tag
What does the image element do?
Embeds images in documents
Which list element is bulleted?
<ul> Unordered List
</ul>
How are heading elements ordered?
From the highest level to the lowest
List the heading elements from highest to lowest.
- <h1>text</h1>
- <h2>text</h2>
- <h3>text</h3>
- <h4>text</h4>
- <h5>text</h5>
- <h6>text</h6>
How is heading hierarchy defined?
By the h1-h6 tags. These create structure both visually and verbally for screen readers.
What are the opening and closing tags for a paragraph element?
- Opening: <p>
- Closing: </p>
What makes up a paragraph element?
Text. The <p> paragraph element contains and displays a block of text.
Why would a unique ID attribute be assigned to different elements?
- In order to differentiate between them.
- When needed, the id value can be called up by CSS and JavaScript to manipulate, format, and perform specific instructions on that element and that element only.
- ID Attribute - uniquely defines an element for linking, scripting or styling.
What do valid id attributes contain?
- Begin with a letter (a-Z)
- Digits (0-9)
- Hyphens ( - )
- Underscore ( _ )
- Periods ( . )
EXAMPLE: <h1 id="A1">Hello World</h1>
Define declarative language?
Describes a desired result without explicitly listing steps that must be performed.
Declarative languages (HTML and CSS) tell an interpreter (browser) what to do, not how to do it. We don’t need to programmatically tell the browser how to display our content. Think of HTML tags as black boxes where we don’t need to worry about the implementation details of how the content of a tag gets displayed to the screen. We just state the end goal and move on.
List three advantages of a coherent HTML structure?
- Enhanced Readability (humans, algorithms, developers, software (screen readers, search engines)
- Accessibility
- Ease of Styling
What is HTML use to create?
The structure and content of a webpage.
What opening and closing tags should any visible content be placed within?
<body> tags
* Opening: <body>
* Closing: </body>
</body>
