gail borden library | html/css program
TRANSCRIPT
![Page 1: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/1.jpg)
HTML BASICSPRESENTED BY MEGAN JOHNSON
![Page 2: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/2.jpg)
HTML BASICS
AGENDA▸ Terminology & Descriptions▸ Set up of in-browser code editor▸ What is an HTML document▸ What are elements, tags and attributes▸ Block vs. Inline Elements
![Page 3: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/3.jpg)
HTML BASICS
TERMS & DEFINITIONS ▸ HTML: (HyperText Markup Language) gives content structure and meaning ▸ Text Editor: a type of program used for editing plain text files▸ Web Browser: an application for locating, retrieving and displaying content▸ Codepen: is an in-browser code editor for writing HTML and CSS with a real-time
preview▸ Elements: are designators that define the structure and content within a page▸ Tags: a set of less-than and greater-than symbols that surround an element▸ Attributes: provide additional information about an element which include a name
and a value▸ Block-level Element: an element that begins a new line, stacking one on top of
the other▸ Inline Element: an element that falls within the normal flow of a document
![Page 4: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/4.jpg)
HTML BASICS
BASIC PAGE STRUCTURE
Declaration
![Page 5: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/5.jpg)
HTML BASICS
BASIC PAGE STRUCTURE
Beginning of <html>
End of </html>
![Page 6: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/6.jpg)
HTML BASICS
BASIC PAGE STRUCTURE
A <head> element housesinformation about the page.
This information is not displayed on the web page itself.
![Page 7: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/7.jpg)
HTML BASICS
BASIC PAGE STRUCTURE
A <body> element houses all the visible content of the web page.
![Page 8: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/8.jpg)
HTML BASICS
A CLOSER LOOK AT TAGS
<p>Opening Tag Closing Tag
Character
Left-Angle Bracket(Less-than Sign)
Right-Angle Bracket(More-than Sign)
</p>Character
Left-Angle Bracket(Less-than Sign)
Right-Angle Bracket(More-than Sign)
Forward Slash
![Page 9: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/9.jpg)
HTML BASICS
WHAT ATTRIBUTES TELL US
<a href=“http://anywhere.com”>Any Where</a>
AttributeName
AttributeValue
![Page 10: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/10.jpg)
NEXT CLASS TOPIC
HTML & CSS
What is CSSThe difference between HTML &
CSSHow to reference a CSS fileWhat are Selectors, Properties and
Values
…and more
![Page 11: Gail Borden Library | HTML/CSS Program](https://reader036.vdocuments.net/reader036/viewer/2022070600/58ce9e001a28abb26e8b49a9/html5/thumbnails/11.jpg)
HTML BASICS
ONLINE CLASS SURVEYhttp://www.gailborden.info/learn
Class: HTML BasicsDate of Class: February 11thInstructor: Megan Johnson