Hamburger Markup Text Language LECTURE 3
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Hamburger Markup Text Language
LECTURE 3
<div>
</div>
<body>
</body>
<li>
</li>
<html>
</html>
<script>
</script>
<head>
</head>
Open Tag
Close Tag
Content
Hamburger Text Markup Language - http://www.dontfeartheinternet.com/html/html
<area ><base><br><col><command><embed><hr><img><input><link><meta><param><source>
Exception to the rule: VOID ELEMENTSVoid Elements are tags that don't require a closing tag to be valid. These elements are usually elements that either stand alone on the page, or where the end of their contents is obvious from the context of the page itself.
<div>Lorem ipsum dolor sit amet.<br/><img src=“example.jpg”/></div>
Void Elements
a - “anchor” used for hyperlinksblockquote - for large quotesbody - visible part of your sitebr - line breakcite - a citationdiv - content dividerDOCTYPE - document typeem - text w/ emphasish1 - most important headerh2 - 2nd most importanth3-h6 - 3-6th most important
head - invisible part of your sitehtml - “what follows is HTML”img - imageli - list itemlink - to attach CSS stylesheetsol - ordered listp - paragraphspan - inline content dividerstrong - strong text emphasisstyle - for inline CSS stylingtitle - title of the pageul - unordered list
Common HTML Tags
List & Definitions via:http://www.dontfeartheinternet.com/html/html
Required Attributessrc is used to specify the location of the image file.alt is used to specify the alternative text of the image, which should be a short description.
Optional Attributesheight can be used to define the height of the image (in pixels). width can be used to define the width of the image (in pixels). (Height & width can also be defined using CSS.
Example
IMG Tag
Info via:http://www.htmldog.com/reference/htmltags/img/
<img src="http://www.website.com/images/logo.gif"
alt=“Logo” height=“50px” width=“50px” />
Code of the DayMonday – Friday
HOMEWORK ASSIGNMENT:Pick a code from the list of HTML tags & CSS selectors. Research the code and put together a definition of the code to present in class.
Site Structure
Home
Web Video Services About
Web
Video
Print &
Branding
Example: www.heatherstrycharz.com
Site Structure
Image via:http://webstyleguide.com/wsg3/3-information-architecture/3-site-structure.html
Next Week
Tutorial:http://www.w3.org/Style/Examples/011/firstcss
CSS Zen Garden
www.csszengarden.com
Related Documents
