My HTML Cheat Sheet

HTML Tutorials — Learn HTML

HowToCodeSchool is a website where you can Learn HTML. HTML stands for Hyper Text Markup Language. Read our Tutorials on HTML to learn everything about HTML.

HTML was Created by Tim Berners Lee from CERN, Robert Cailliau and some others geniuses in late 80s and start of 90s. HTML is not a Programming Language but a Markup Language.

What is HTML — HTML Introduction

HTML stands for Hyper Text Markup Language. HTML is primary language to make a Web Page or Website.

HTML Tags

HTML Tags are the keywords that are used to construct the simple HTML Document, Web Page or Website.

List of HTML Tags By Category

The main types of HTML Tags are Basic HTML Tags, Formatting HTML Tags, Forms and Input Tags, Frame Tags, Style and Semantic Tags, Link Tags, Audio Video Tags, Meta Tags, Programming Tags and Table Tags.

HTML Document

HTML Document is file or page containing HTML. HTML is a markup language which consists of Tags, HTML Tags are used to display the content on the browser.

Читайте также:  Allow javascript on chrome

HTML Versions

HTML5 is the latest version of HTML. Other versions of HTML include HTML 1.0, HTML 2.0, HTML 3.2, HTML 4.01 and XHTML.

How to write HTML Code

Writing HTML Code is very simple. HTML uses markups or tags to display the content on the browser. HTML code is written inside the .html file.

HTML Elements

HTML element is the combination of HTML starting tag, HTML ending tag and the content that’s inside the starting tag and ending tag. Sometimes HTML Element is also refereed as HTML Tag. A Web Page is made up of these HTML Elements. All HTML Elements are Descendants of one or more HTML Elements.

HTML Attributes

HTML Attribute is something that we use in the starting tag of HTML Elements or HTML Tags which provides extra information about those HTML Elements or HTML Tags.

List of all HTML Attributes and Their Function

HTML Attributes provide extra information about HTML Tags. This is the List of all HTML Attributes and their Function. HTML Attributes are used in almost all HTML Elements.

HTML Cheat Sheet

This HTML Cheat Sheet contains information about HTML Tags, HTML Attributes, HTML Symbols and Structure of HTML5 Document and more.

HTML MCQS

All important HTML MCQS are given with answers, These HTML MCQS cover all topics related to HTML.

Источник

HTML Cheat Sheet – HTML Elements List Reference

Ihechikara Vincent Abba

Ihechikara Vincent Abba

HTML Cheat Sheet – HTML Elements List Reference

In this tutorial, we will go over commonly used HTML tags, elements, and attributes. We’ll also see examples of how these tags, elements, and attributes work.

You can use this article as a reference guide whether you’re a beginner or experienced developer.

What Makes Up an HTML Document?

The following tags define the basic HTML document structure:

  • tag – This tag acts as a container for every other element in the document except the html> tag.
  • tag– Includes all the document’s metadata.
  • tag – Defines the title of the document which is displayed in the browser’s title bar.
  • tag – Acts as a container for the document’s content that gets displayed on the browser.

Here’s what all that looks like:

html> specifies that we are working with an HTML5 document.

The following tags give additional information to the HTML document:

  • tag – This tag can be used to define additional information about the webpage.
  • tag – Used to link the document to an external resource.
  • tag – Used for defining styles for the document.
  • tag – Used to write code snippets (usually JavaScript) or to link the document to an external script.
      *  

HTML Document Structure

When you’re fleshing out your HTML document, you’ll use certain tags to create the structure.

The to tags show different levels of headings in a document, with being the largest and being the smallest.

 

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

You use the

tag to create a paragraph.

The tag can be used to divide and style separate sections of the document. It also acts as a parent container for other elements. Here’s how it works:

 

This is the news section

Welcome to the news section!

This is the contact us section

Hello world!

We also have the tag. This is similar to but you use it as an inline container.

There’s the
tag, which we use for creating line breaks. This has no closing tag.

The


tag is used to create a horizontal line. It also has no closing tag.

Images in HTML

In HTML, we use the tag to display images.

Here are some attributes of the tag:

  • src is used to specify the path to the location of the image on your computer or the web.
  • alt defines an alternate text that displays if the image cannot be rendered. The alt text is also good for screen readers.
  • height specifies the height of the image.
  • width specifies the width of the image.
  • border specifies the thickness of the borders, which is set to 0 if no border is added.

Text Formatting in HTML

We have many ways to format text in HTML. Let’s go over them now briefly.

  • displays text in italics.
  • displays text in bold.
  • displays text in bold. Used to make important emphasis.
  • another emphasis tag that displays text in italics.
  • defines subscript text, like the two atoms of oxygen in CO₂.
  • defines a superscript like the power of a number, 10².
  • reduces the size of text.
  • defines deleted text by striking a line through the text.
  • defines inserted text which is usually underlined.
  • is used to enclose a section of text quoted from another source.
  • is used for shorter inline quotes.
  • is used for citing the author of a quote.
  • is used for showing the author’s contact information.
  • denotes an abbreviation.
  • displays code snippets.
  • highlights text.

italic text

bold text

strong text

strong text

subscripted text

superscripted text

small text

deleted text

inserted text

quoted text

short quoted text

cited text

address

inserted text

code snippet

marked text

Here are some attributes of the tag:

  • href specifies the URL the link takes the user to when clicked.
  • download specifies that the target or resource clicked is downloadable.
  • target specifies where the link is to be opened. This could be in the same or separate window.

Lists

    tag defines an ordered list while the
    tag defines an unordered list.

Forms

The tag is used to create a form in HTML. Forms are used to get user inputs. Here are some attributes associated with the element:

  • action specifies where the form information goes when submitted.
  • target specifies where to display the form’s response.
  • autocomplete can have a value of on or off.
  • novalidate specifies that the form should not be validated.
  • method specifies the HTTP method used when sending form data.
  • name specifies the name of the form.
  • required specifies that an input element cannot be left empty.
  • autofocus gives focus to the input elements when the page loads.
  • disabled disables an input element so the user can longer interact with it.
  • placeholder is used to give users a hint on what information is required for an input element.

Here are other input elements associated with forms:

  • for getting user text input with multiple lines.
  • specifies a list of options the user can choose from.
  • creates an option under the select element.
  • specifies an input field where the user can enter data. This has a type attribute that specifies what type of data the user can input.
  • creates a button.
        

Tables

 
Course Progress
HTML 90%
CSS 80%
JavaScript 95%

Tags introduced in HTML5

Here are some tags introduced in HTML5:

  • specifies the webpage header
  • specifies the webpage footer.
  • specifies a main content section.
  • specifies an article’s section, usually for content that can stand alone on the webpage.
  • is used to create separate sections.
  • is usually used to when placing items in a sidebar.
  • is used for formatting date and time.
  • is used for figures like charts.
  • denotes a description of a figure.
  • is used to nest navigation links.
  • is used to measure data within a range.
  • is used as a progress bar.
  • is used to create a dialog box.
  • is used to embed an audio file in the web page.
  • is used to embed video.

Conclusion

In this article, we have seen a lot of HTML tags, elements, and attributes commonly used by developers. This is not all there is, but should serve as a good reference resource.

I hope you found this helpful. Thank you for reading.

Источник

Оцените статью