Create a free account Verify your email address Using CODEPEN Log in to your account Click on the posted codepen URL Click Fork HTML Defines STRUCTURE HyperText Markup Language HTML should be used for defining ID: 782613
Download The PPT/PDF document "HTML Basics Setting up CODEPEN" is the property of its rightful owner. Permission is granted to download and print the materials on this web site for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Slide1
HTML Basics
Slide2Setting up CODEPEN
Create a free account
Verify your email address
Slide3Using CODEPEN
Log in to your account
Click on the posted
codepen
URL
Click Fork
Slide4HTML Defines STRUCTURE
HyperText
Markup Language
HTML should be used for defining
WHAT is on the page
NOT
how it LOOKS
Why?
Consistency
Alternate presentation
Simplicity
CSS (Cascading Style Sheets) for format (Thursday)
Slide5General Rules
Two types of commands
Single commands
<
command> or < command />
Start/end commands
<command> ... </command>
Tags can have additional information associated with them –
attributes
<command attribute=…> … </command>
Blank lines and spaces don’t matter
Slide6HTML Start/End Tags
Are like boxes:
You can nest them
You can put them side by side
They are not links
You can not intertwine them
Slide7Another Important Difference
Whether they start a new line or not
Paragraphs do
Emphasize does not
Slide8Correctly Nested Tags
Some can take any content
d
ivisions, footers
Some have restrictions
Paragraphs can not have lists inside them
Some tags are limited as to where they can appear
List items can only appear in lists
Incorrectly nested tags MAY appear to work
Slide9Formatting your SOURCE
Comments
<!-- any text you want -->
Indentation
Nested parentheses
Multi-line
Line up start and end
Things inside belong one tab over
Single line
Start, content, end on a single line
Always
include your name in date in every file
Slide10The Basics
Regular text = paragraph
Header numbers represent style, not order
Lists
consist
of list delimiters and list items
Slide11Lab