Skip to content

refactor: update html cheatsheet #117

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Oct 22, 2022
Merged

refactor: update html cheatsheet #117

Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
94ec58e
refactor: update html cheatsheet
Manoj0Marmat Oct 22, 2022
3d46b3c
refactor: adding definations
Manoj0Marmat Oct 22, 2022
cb9fc33
Merge branch 'main' into newHtml
crescentpartha Oct 22, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 29 additions & 9 deletions CheatSheets/html-cheatsheet.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
- [Basic Tags of HTML](#basic-tags-of-html)
- [Tags to Structure Document](#tags-to-structure-document)
- [Semantic Elements](#semantic-elements)
- [Formatting](#formatting)
- [Links](#links)
- [Images](#images)
- [Lists](#lists)
Expand All @@ -13,6 +14,7 @@
# HTML CheatSheet for Developers

## Basic Tags of HTML
>tags are like keywords which defines that how web browser will format and display the content.

| Command | Description |
| ---------------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
Expand All @@ -39,23 +41,18 @@
| `<hr/>` | In addition to switching to the next line, this tag also drawsa horizontal bar to indicate the end of the section. |
| `<strike>...</strike>` | Another old tag, this is used to draw a line atthe center of the text, so as to make it appearunimportant or no longer useful. |
| `<cite>...</cite>` | Tag for citing author of a quote. |
| `<del>...</del>` | Pre-formatted, ‘monospace’ text laid out with whitespace inside the element intact. |
| `<ins> … </ins>` | Denotes text that has been inserted into the webpage. |
| `<blockquote> … </blockquote>` | Quotes often go into this tag. Is used in tandem with the <cite> tag. |
| `<blockquote> … </blockquote>` | Quotes often go into this tag. Is used in tandem with the `<cite>`tag. |
| `<q> … </q>` | Similar to the above tag, but for shorter quotes. |
| `<abbr> … </abbr>` | Denotes abbreviations, along with the full forms. |
| `<address> … </address>` | Tag for specifying author’s contact details. |
| `<dfn> … </dfn>` | Tag dedicated for definitions. |
| `<code> … </code>` | This is used to display code snippets within a paragraph. |
| `<sub> … </sub>` | Used for writing a subscript (smaller font just below the mid-point of normal font). |
| `<sup> … </sup>` | Similar to the above tag, but for superscripting. |
| `<small> … </small>` | Reduces text size. In HTML5, it often refers to redundant or invalid information. |
| `<strong> … </strong>` | This element indicates that its contents have strong importance or urgency. Browsers usualy render the contents in bold type. |
| `<em> … </em>` | This tag is used to define emphasized text. The content inside is typically displayed in italic. |
| `<aside> … </aside>` | Its a Block level element that defines content aside from the content in which it is Placed. |

**[🔼Back to Top](#table-of-contents)**

## Semantic Elements
>semantic element clearly describes its meaning to both the browser and the developer.

| Command | Description |
| -------------------------------- | ------------------------------------------------------------------------------------------- |
Expand All @@ -67,15 +64,34 @@
| `<footer> ... </footer>` | Defines a footer for a document or section |
| `<header> ... </header>` | Specifies a header for a document or section |
| `<main> ... </main>` | Specifies the main content of a document |
| `<mark> ... </mark>` | Defines marked/highlighted text |
| `<nav> ... </nav>` | Defines navigation links |
| `<section> ... </section>` | Defines a section in a document |
| `<summary> ... </summary>` | Defines a visible heading for a `<details>` element |
| `<time> ... </time>` | Defines a date/time |

**[🔼Back to Top](#table-of-contents)**

## Formatting
>Formatting elements were designed to display special types of text:

| Command | Description |
| ------------------------ | ---------------------------------------------------- |
| `<b> ... </b>` | Defines bold text |
| `<em> ... </em>` | Defines emphasized text |
| `<i> ... </i>` | Defines a part of text in an alternate voice or mood |
| `<small> ... </small>` | Defines smaller text |
| `<strong> ... </strong>` | Defines important text |
| `<sub> ... </sub>` | Defines subscripted text |
| `<sup> ... </sup>` | Defines superscripted text |
Comment on lines +86 to +91
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are some duplicate tags. Please, rearrange and delete the duplicate tags. Your Formatting section is looking very good. If those tags already exist, then remove the older one and rearrange them like the Formatting section. Try to check your newly added tags with the original html-cheatsheet.md file. Otherwise, creating a new conflict again.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I already removed older repeated tags please check

| `<ins> ... </i>` | Defines inserted text |
| `<del> ... </del>` | Defines deleted text |
| `<mark> ... </mark>` | Defines marked/highlighted text |

**[🔼Back to Top](#table-of-contents)**

## Links
>links allow users to click their way from page to page.


| Command | Description |
| ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------ |
Expand All @@ -88,6 +104,7 @@
**[🔼Back to Top](#table-of-contents)**

## Images
>images can improve the design and the appearance of a web page.

| Command | Description |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------ |
Expand All @@ -107,6 +124,7 @@
**[🔼Back to Top](#table-of-contents)**

## Lists
>lists allow web developers to group a set of related items in lists.

| Command | Description |
| -------------- | ----------------------------------------------------------- |
Expand All @@ -120,6 +138,7 @@
**[🔼Back to Top](#table-of-contents)**

## Forms
>form is used to collect user input. The user input is most often sent to a server for processing.

| Command | Description |
| ------------------ | -------------------------------------------------------------------------------- |
Expand All @@ -130,6 +149,7 @@
**[🔼Back to Top](#table-of-contents)**

## Tables
>tables allow web developers to arrange data into rows and columns.

| Command | Description |
| -------------------------- | ------------------------------------------------------------------ |
Expand Down