Introduction with CSS?

 

What is CSS?

CSS is short form of Cascading style sheet. Similar to HTML, CSS is not a programming language or a markup language. Instead, CSS is a style sheet language that is used to define that how a websote should look. It makes the HTML / XML code presentable in a customizable form. CSS enables users to apple styles to web pages. It defines that how a web page should look. With CSS, users can control colours, fonts, spacing and formatting of a HTML document. Additionally, CSS is easy to learn and provides users powerful control over the presentation of an HTML document.

What is difference between HTML and CSS?

Both languages are not programming languages. HTML is structural language which is used to define basic structure of a web page. It is used to define basic elements in a web page or web site. Whereas, CSS is style sheets language which is used to make a HTML document presentable. It is used to design the structure of a document written in HTML / XML. It can be used to define formatting of a document i.e colours, fonts, spacing, margins, padding, animations etc. An example of difference b/w HTML and CSS is as displayed below:-

Why we use CSS?

• To Save Time: CSS can be used to save time as style sheet can be re-used. Moreover, single CSS code can be used on multiple classes of HTML. For example, user has defined a heading in H3, a single CSS style can be used to design all H3 heading in a website/webpage.
• Easy Maintenance: CSS is a user-friendly style language; user can make global changes with simple editing / amendments. Changes will automatically update all elements where required instantly.
• Search Engine Friendly: CSS is a clean coding technique, for which search engine won’t have to difficulties to read its content.
• Separate Concept of Designing: CSS defines user separate concept of designing and structure. Its means that user can make changes in look without getting involved in HTML coding. This is very useful when user is working with large web pages, as it ensures maintenance of content easier.
• Good grip over styling: CSS provides a good grip on styling options rather than HTML. With its use, user can control every element by formatting or by layout. This provides user flexibility and control over the appearance of website.
• Offline Browsing: CSS can be used to store web application on local storage. Its mean that user can view and manage website offline before uploading / publishing it on live server.

Syntax of CSS

Syntax of CSS is very simple, easy to understand and clear. Sytle rule consist of selector and declaration block. Example is mentioned below:-

H1 (This is a selector) {

Color: Blue;

Font-size: 12px:

} (This is declaration block)

This CSS style code will make the look of H1 (Heading 1) as:-

Text Colour will be Blue.

Font Size will be 12 px.

The selector refers to the HTML element you want to style.

The declaration block contains one or more declarations separated by a semicolon.

Each declaration includes a CSS property name and a value, separated by a colon.

 

Introduction with HTML

What is HTML? 

HTML is short for Hyper Text Markup Language, and it's a widely-used standard language for creating web pages and displaying information on websites. Essentially, HTML defines the basic structure of a web page using a series of elements or tags, much like a document might have headings, paragraphs, and other formatting. Since its invention in 1989 by Tim Berners Lee, HTML has been a fundamental technology for web development.

What is the use of HTML?

Hyper Text Markup Language, or HTML, is a crucial tool in defining the skeletal structure of any website or web page. It is the foundation upon which all other content and features are built. HTML is used to define many common elements, such as paragraphs, line breaks, block elements, and headings.

How are Elements / Tags used?

HTML is a markup language that contains over a hundred built-in tags to define the structure of a web page. Each tag starts with its opening symbol, <Tag Name>, and ends with its closing symbol, </Tag Name>.

When it comes to the basic structure of a web page, there are three essential tags. Firstly, the <html> tag indicates that the document is an HTML document. Secondly, the <head> tag creates the head of the web page, which contains essential information such as Charset, Meta Tags, external style sheets, or any other external links. Finally, the <body> tag defines and creates the structure of the entire web page.

Formatting in HTML

·       Paragraphs and Line Breaks
Paragraphs are created using the HTML <p> element, which is one of the most frequently used elements on a web page. Line breaks are similar to print media, visually separating paragraphs from other content to emphasize their semantic separation. Block elements, such as <div>, <article>, and <table>, create spacing below themselves and allow HTML to divide a webpage into sections. 

·       Headings of Paragraphs

Headings and paragraphs work in tandem to establish a web page's structure and content. HTML provides six heading elements, numbered from 1 through 6, with h1 being the most significant. h1 typically contains the content's title, while h2 represents a subsection. The subsequent headings, h3 through h6, identify further subjects in subsections.

·       Common Formatting of Document

HTML has its basic feature to format a web page like a document. Strong tag <Strong> tag can be used to make selected text Bold. Italic tag <i> is used to make text italic whereas, <u> tag is used to underline the text.

"It is important to mention that HTML is a markup language and cannot be used as a programming language. It only defines the Skelton structure and content of a web page but cannot provide dynamic features or interactions."