DEV Community

Arun kumar G
Arun kumar G

Posted on

Day 01 - Py Full Stack - HTML

HTML INTRODUCTION,TAGS,ATTRIBUTES,FORMATTING,QUOTATION,HYPERLINKS

HTML - Hypertext Markup Language - Founder TIM BERNERS LEE

  • Standard Markup language to create webpages.
  • Uses series of tags/ elements to help browsers to display the content

Basic Syntax:

<!DOCTYPE html> ---> Indicates the declaration of using HTML5

---> Root tag of HTML

---> Contains Meta Information about the HTML page

---> Used to project the title of Browser tab

---> Block level element

---> Heading - LARGEST --- total 6 Heading tags

---> Paragraph tag

TAGS IN HTML:

  1. Self closing tag / Empty tag:


is an example ---> This tag wont have closing tags

  1. Nested Tag

HTML tags are can be nested within another tags.

TAG ATTRIBUTES:

  1. Attributes provides an additional infomation about the tag
  2. Names and values are most important part of attributes example: lang attribute ---> Helps browser to understanding the content is in English language

What is meant by FAVICON in HTML?

Favicon is an Image Icon present in the title bar of a webpage's browser tab.

Syntax: #

HTML FORMATTING:

  1. Headings ---> H1 to H6
  2. Paragraph ---> #

    sentence #

  3. Pre ---> preserve the format ---> #
     sentence  same as ip #
  4. line Break - #
  5. Horizontal Ruler - #

FORMATTING TAGS:

BOLD #

BOLD WITH MORE IMPORTANCE #

Italic #

Emphasized with different tone while reading #

Underlined #

Inserted same as underline --- Inserted into a doc #

small size text #

Highlight the text in yellow #

Strike out the text #

Super script to write A square #

Sub script to write H2O #

HTML5 QUOTATION:

  1. BLOCK QUOTE TAG ---> #
    Quotes
    #
  2. SHORT QUOATATION TAG ---> # Arun is a good boy # ---> It will auto insert quotation mark.
  3. ABBREVATION TAG ---> # WWW #
  4. ADDRESS TAG ---> # Your address will be shown in Italic #
  5. CITE TAG ---> To show case the details of a product ---> Just italic to showoff
  6. BI DIRECTIONAL OVERRIDE TAG ---> bdo tag is used to change the align of the text ---> # the text will be in left to right

HTML5 HYPERLINKS:

  1. Internal Hyperlink: #Home page
  2. External Hyperlink: # Email us to reach
  3. PAGE Jump Hyperlink:

chaper 1

Chapter1

  1. LINK Attribute: Title Attribute and target attribute

title = tooltip
target = Open in a new tab = "_blank" ---> Open in same tab ="_self"

  1. IMAGE AS A SOURCE:

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

Image of Datadog

The Essential Toolkit for Front-end Developers

Take a user-centric approach to front-end monitoring that evolves alongside increasingly complex frameworks and single-page applications.

Get The Kit

👋 Kindness is contagious

If this article connected with you, consider tapping ❤️ or leaving a brief comment to share your thoughts!

Okay