HTML Basics
  • <!DOCTYPE> – Define HTML Version
  • <html> – Root of an HTML Document
  • <body> – Content Of HTML Document
  • <style> – Internal CSS Styling
  • <script> – Scripting
  • <noscript> – Disable Script
Document Structure
  • <p> – Paragrap | Block
  • <h[1-6]> – Headings | Block
  • <div> – Block Section In Document
  • <span> – Inline Section In Document
  • <br /> – Inserts Single Line Break
  • <hr /> – Inserts Horizontal Line
  • <!– –> – Comment
Meta Information
  • <head> – Info About Document
  • <title> – Defines Document Title
  • <meta> – Contains Metadata
  • <base> – To Specify Default URL
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
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
  • <canvas> – Draw graphics & animation
  • <svg> – Container | SVG graphics
  • <map> – Clickable areas on image
  • <area> – In conjunction with <map>
HTML Forms
  • <form> – Defines HTML Form
  • <fieldset> – Collection Of Fields
  • <legend> – ↑ Caption For Content
  • <label> – Label for <input>
  • <input /> – Defines Input Controls
  • <select> – Drop-down Box
  • <optgroup> – Group Of Options
  • <option> – Drop-down Options
  • <textarea> – Large Text Input
  • <button> – Clickable Button
HTML Images
  • <img /> – Embeds Image | “src”
  • <map> – Clickable areas on image
  • <area /> – In conjunction with <map>
HTML Lists
  • <ul> – Unordered List
  • <ol> – Ordered List
  • <li> – List Item
  • <dl> – Definition List
  • <dt> – Definition Term
  • <dd> – Description Details
HTML Tables
  • <table> – Defines Table
  • <caption> – Table Caption
  • <th> – Header Cell In Table
  • <tr> – Defines Table Row
  • <td> – Define Table Data
  • <thead> – Header of Column
  • <tbody> – Set Of Table Row | Body
  • <tfoot> – Summarizing Columns
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
HTML Links
  • <a> – Anchor Element | “href”
  • <link /> – Relative | External Source
  • <a href=”mailto:”> – Email Link
  • <a href=”#name”> – Link To Anchor
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
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
  • autoplay – Auto Playing audio/video
  • controls – Display Media Controls
  • loop – Start overAgain audio/video
  • muted – Muted output | audio/video
  • poster – Cover image (Video) | “URL”