Web Foundations/Block Elements: Difference between revisions
Sorted |
→Activities: added a relevant link Tags: Reverted Visual edit |
||
| Line 79: | Line 79: | ||
# Complete the tutorial [https://www.tutorialspoint.com/html/html_elements.htm TutorialsPoint: HTML Elements] |
# Complete the tutorial [https://www.tutorialspoint.com/html/html_elements.htm TutorialsPoint: HTML Elements] |
||
# Complete the tutorial [https://www.tutorialspoint.com/html/html_attributes.htm TutorialsPoint: HTML Attributes] |
# Complete the tutorial [https://www.tutorialspoint.com/html/html_attributes.htm TutorialsPoint: HTML Attributes] |
||
# Complete the tutorial [https://www.scaler.com/topics/html/inline-and-block-elements/ Scaler Topics: Inline and Block Elements] |
|||
== Key Terms == |
== Key Terms == |
||
Revision as of 08:41, 16 March 2022
This lesson introduces HTML block elements.
Objectives and Skills
Objectives and skills for this lesson include:[1][2]
- Use the most current version of Hypertext Markup Language (HTML5) to create web pages.
- Design web pages to industry standards.
Reads
Videos
Examples
Section Headings
<h1>Level 1 Heading</h1>
<h2>Level 2 Heading</h2>
<h3>Level 3 Heading</h3>
<h4>Level 4 Heading</h4>
<h5>Level 5 Heading</h5>
<h6>Level 6 Heading</h6>
Example:
Level 1 Heading
Level 2 Heading
Level 3 Heading
Level 4 Heading
Level 5 Heading
Level 6 Heading
Paragraph
<p>paragraph text</p>
Example:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Quotation (indented margins)
A block level quotation, for when the quotation includes block level elements.[3]
<blockquote>quotation</blockquote>
Example:
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Pre-formatted Text
<pre>text</pre>
Example:
text
goes
here
Horizontal Rule
<hr>
Example:
Activities
- Complete the tutorial TutorialsPoint: HTML Blocks
- Complete the tutorial TutorialsPoint: HTML Elements
- Complete the tutorial TutorialsPoint: HTML Attributes
- Complete the tutorial Scaler Topics: Inline and Block Elements
Key Terms
- block-level element
- heading tag
See Also
-
References