HTML Basics
Document Structure
HTML Images
HTML List
HTML Links
HTML Text Formatting
- <strong> - Strong Emphasis | Bold
- <em> - Emphasis | Italic
- <blockquote> - Long Quotation
- <q> - Short Quotation
- <cite> - Title of a creative work
- <abbr> - Abbrieviation | "title"
- <def> - Definition
- <address> - Address | Contact Info
- <pre> - Pre-Formatted Text
- <code> - Display Computer Code
- <bdo> - Text Direction | dir="rtl/ltr"
- <ins> - Text Inserted | Underline
- <del> - Text Removed | Strike Line
- <sup> - Defines Superscript Text
- <sub> - Defines Suberscript Text
HTML Semantic Elements
- <header> - header for docm/section
- <nav> - Set of navigation links
- <main> - Main content of documnt
- <footer> - Footer for docm/section
- <section> - Section of a document
- <article> - Self-contained content
- <aside> - Aside from content | Sidebar
- <details> - Details | User can view/hide
- <summary> - Heading for a <details>
- <figure> - Self-contained Content
- <figcaption> - Caption for <figure>
- <mark> - Marked/highlighted text
- <time> - Defines a date/time
- <output> - Display Results | Scripts
- <progress> - Display Progress Bar
HTML Media
- <img> - Used to embed images
- <audio> - Used to embed audios
- <video> - Used to embed videos
- <picture> - Multiple sources for image
- <iframe> - Embed extrnl WebPage/Doc
- <embed> - Container | Extrnl Resources
- <source> - Hover Me ⇖
- <track> - Hover Me ⇖
- <canvas> - Draw graphics & animation
- <svg> - Container | SVG graphics
- <map> - Clickable areas on image
- <area> - In conjunction with <map>
HTML Forms
HTML Input Types
- <input type="text"> - Single line text input
- <input type="number"> - Numeric input field
- <input type="email"> - Input field for e-mail address
- <input type="password"> - Password Field
- <input type="reset"> - Reset all values to default values
- <input type="submit"> - Form data to a form-handler
- <input type="button"> - Defines a button
- <input type="search"> - Used for search fields
- <input type="tel"> - For telephone number
- <input type="url"> - Should contain a URL address.
- <input type="checkbox"> - Defines a checkbox
- <input type="radio"> - Defines a radio button
- <input type="color"> - Input field | Color Picker
- <input type="file"> - "Browse" button for file upload
- <input type="hidden"> - Hidden | Not visible to a user
- <input type="image"> - Defines image as a submit btn
- <input type="range"> - Slider control | Def range is 0 to 100
- <input type="time"> - To select a time | no time zone
- <input type="date"> - Input field | Date picker
- <input type="datetime-local"> - Specifies a date and time
- <input type="month"> - To select a month and year
- <input type="week"> - To select a week and year
Most Useful Attributes
- class - Specifies a class for Element
- id - Speci Unique id for Element
- src - Specifies the location (URL)
- href - Specifies the URL
- target - Speci Where to Open <a>
- download - Target will be downloaded
- title - Title for an HTML element
- alt - Alternative text for <img >
- type - Specify the type of content
- rel - Relatinshp betwn Document
HTML Media Attributes
HTML Event Attributes