HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a...
Transcript of HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a...
![Page 1: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/1.jpg)
HTML HeadingsHeadings are defined with the <h1> to <h6> tags. <h1> defines the most important heading. <h6> defines the least important heading.Example<html><head><title>Heading Tags</title></head><body><h1>This is heading 1</h1><h2>This is heading 2</h2><h3>This is heading 3</h3><h4>This is heading 4</h4><h5>This is heading 5</h5><h6>This is heading 6</h6></body></html>Save this a XXHeadings.html in your student drive and view it.
HTML Code: Headings
![Page 2: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/2.jpg)
![Page 3: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/3.jpg)
The <hr> tag is used to separate content in your page.
<html>
<head><title>Horizontal Line</title></head><body><p>The hr tag defines a horizontal rule:</p><hr><p>This is a paragraph.</p><hr><p>This is a paragraph.</p></body></html>Use the Save AS feature and save this into your student folder with your initials
XXhrtag.html, open and view the document, it should look like this:
HTML Code: Using Horizontal Lines
![Page 4: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/4.jpg)
![Page 5: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/5.jpg)
What do these tags do?
<html>
<body>
<h1> to <h6><hr>
POP QUIZ
Defines an HTML document
Defines the document's body
Defines HTML headings
Defines a horizontal line
![Page 6: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/6.jpg)
The <p> tag is used to designate a new paragraph. The <br> tag is used to designate a line break in your text.
<html><head><title>Paragraph and Line Breaks</title></head><body>The line break allows you to move your text<br>To the next line.<br><p>The Paragraph tag allows you to start a new paragraph and double spaces from previous line.</p></body></html>
Use the Save AS feature and save this into your student folder with your initials
XXPandBRtag.html, open and view the document, it should look like this:
HTML Code: Paragraph and Line Breaks
![Page 7: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/7.jpg)
![Page 8: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/8.jpg)
There are numerous codes to help you easily format your text, lets try a few
<html><head><title>Formatting Text</title></head><body><p><b>This text is bold</b></p><p><strong>This text is strong</strong></p><p><i>This text is italic</i></p><p><em>This text is emphasized</em></p><p><code>This is computer output</code></p><p>This is<sub> subscript</sub> and <sup>superscript</sup></p></body></html>Use the Save AS feature and save this into your student folder with your initials
XXFormatText.html, open and view the document, it should look like this:
HTML Code: Formatting Text
![Page 9: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/9.jpg)
![Page 10: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/10.jpg)
What do these tags do?
<br>
<p>
<b> and <strong><i> and <em>
<code><sub><sup>
POP QUIZ
Allows you to put in a line break
Defines a paragraph
Text is bolded
Text is italicized
Text is formatted as subscript
Text is formatted as superscript
Text is formatted as computer output
![Page 11: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/11.jpg)
The HTML <a> tag defines a hyperlink.A hyperlink (or link) is a word, group of words, or image that you can click on to jump to another document.
When you move the cursor over a link in a Web page, the arrow will turn into a little hand.
The most important attribute of the <a> element is the hrefattribute, which indicates the link’s destination.
By default, links will appear as follows in all browsers:An unvisited link is underlined and blueA visited link is underlined and purpleAn active link is underlined and red
HTML Code: Hyperlinks (Links)
![Page 12: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/12.jpg)
Links can be to an outside source or and internal source. The target=“blank” attribute and value allow the links to be opened in their own page.
<html><head><title>Internal and External Links</title></head><body><a href="http://www.espn.com/" target="blank">This is an external link to ESPN</a><br>
<a href=“XXShell.html" target="blank">This is an internal link to my HTML Shell</a></body></html>Use the Save AS feature and save this into your student folder with your initials
XXlinks.html, open and view the document, it should look like this:
HTML Code: Hyperlinks (Links)
![Page 13: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/13.jpg)
![Page 14: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/14.jpg)
What do these tags do?
<html>
<body>
<h1> to <h6><hr>
<a>
What is an external Link
What is an internal Link
Review
Defines an HTML document
Defines the document's body
Defines HTML headings
Defines a horizontal line
Defines a hyperlink (link)
A link to an outside website
A link to a current page in your website
![Page 15: HTML Code: Headingshansenallatoona.weebly.com/uploads/2/9/7/8/... · The HTML tag defines a hyperlink. A hyperlink (or link) is a word, group of words, or image that you](https://reader034.fdocuments.net/reader034/viewer/2022042710/5f9a185b23a9f40ee2274106/html5/thumbnails/15.jpg)
What do these tags do?
<br>
<p>
<b> and <strong><i> and <em>
<code><sub><sup>
Review
Allows you to put in a line break
Defines a paragraph
Text is bolded
Text is italicized
Text is formatted as subscript
Text is formatted as superscript
Text is formatted as computer output