👉HTML stand for Hypertext Markup Language.
👉 It is a programming language used to determines the structure of web pages or documents.
👉 HTML elements tell the brower how to display the content.
👉 Hypertext is text which contains links to other texts.
Markup tells a web browser how to display text, images and other forms of multimedia on a web page.
HTML tags are identifier which is used to create HTML elements.It's a way to define & create interactive elements.
types--->
- Semantic Tags
- Non Semantic Tags
Semantic HTML tags are tags that define the meaning of the content they contain.
For example, tags like <header>, <article>, and <footer> are semantic HTML tags. They clearly indicate the role of the content they contain.
An HTML element is the collection of start and end tags with the content inserted in between them.
The HTML element consist of 3 parts
i) Opening tag
ii)Closing tag
iii)Content
It's a way to pass an additional information to the elements for performing a specific task
⚫src
⚫style
⚫alt
⚫title
⚫name
Both the tags (<div> and <span>) are used to represent the part of the webpage, <div> tag is used a as block part of the webpage and <span> tag is used as a inline part of the webpage like below:
- Strict Doctype
- Transitional Doctype
- Frameset Doctype
The <svg> tag is used as a container for SVG graphics.
SVG (Scalable Vector Graphics) is a language for two-dimensional graphics based on XML with support for animation and interactivity. To draw images, it uses simple geometrical figures (circle, lines, polygon, etc.)
CSS stands for Cascading Style Sheets. It is the language for describing the presentation of Web pages, including colours, layout, and fonts, thus making our web pages presentable to the users.
CSS describes how HTML elements should be displayed.
CSS can be added to HTML documents in 3 ways:
Inline - by using the style attribute inside HTML elements
Internal - by using a <style> element in the section
External - by using a element to link to an external CSS file
The only difference between them is that “id” is unique in a page and can only apply to at most one element, while “class” selector can apply to multiple elements.
box-sizing: border-box is a CSS property that affects how an element's total width and height are calculated. By default, when you specify a width and height for an element in CSS, those values are applied to the element's content area only. The element's border, padding, and margins are added to the width and height values, resulting in a total width and height that can be larger than you intended.
With box-sizing: border-box, the element's specified width and height include the border and padding values, but not the margin. This means that the content area will be smaller than it would be with the default box-sizing value. The margin values are still added to the total width and height.