CSS Introduction
10-05-2017    419 times
CSS Introduction

Introduction to CSS: The Full Form of CSS is Cascade Style Sheet

We can apply various styles, color, and animation on almost every HTML elements using CSS. Now-a-days we cannot plan or design a webpage without CSS. Each and every developer has their own technique to use the CSS for their website. But almost every of students blindly follow that codes and copy pastes their own web pages without understanding it properly. But a good programmer must understand the magic of CSS for better result. Otherwise, they cannot create their own style.

Main Function OF CSS

By HTML we can design a web page but do not apply any style on it. CSS is a style creator language of HTML page. For example, CSS can handle or design colors, font, margins, height, lines, width, advanced positions, background images and so on. It can change the look and feel of a web page that make more attractive websites.

Tutorial at home

CSS has more options to make a sophisticated web site. It is is supported by all the recent time browsers. CSS can enable Responsive web site. That is a site can display in all size devices ( Desktop, Laptop, Tab, Smart mobile ).

CSS is a very easy language, You can design an attractive style sheet only knowing some property and there possible values.

Why We use CSS?

  1. Increases the download speed [compact the file size by reducing the HTML clutter]
  2. make page more accessible
  3.  Reduces the time of spent for maintaining and changing the site.
  4. Multiple style will be cascade into one.

How Do Style Sheets Work?

CSS files(style sheets) are just a text files with extension .css, or text embedded in the head tag of an HTML file. If we create a .css file then we must link it to the HTML File. The content of a web pages are placed to a HTML file and the appearances are placed into a style sheet. A style sheet is a set of instructions, that gives instruction to a web browser how to draw or display the page.

Tutorial at home

We can apply various styles, color, and animation on almost every HTML element using CSS. Now-a-days we cannot think or plan to design a webpage without CSS. It simply changes the look and feel of a web page. Each and every developer has their own technique to use the CSS for their website. But a lot of students blindly follow that codes and copy pastes their own web pages without understanding it properly. But a good programmer must understand the magic of CSS for better result. Otherwise, they cannot create their own style. CSS can change or design the following part of the HTML,

  • Text
  • Font
  • Images
  • Link
  • Border
  • Table
  • And so on……

Learning of CSS is very easy, but students must apply it in the right way in the web pages. It provide a lot of powerful control on our page.

Types of CSS implementation

We can use CSS in three ways

Inline CSS directly writes in the HTML tag using the style attribute. Any browser gives highest priority to inline CSS. It's effect on the specific HTML tag

Screenshot of Inline CSS
Inline CSS Tag

Syntax: <P style=”color:red”> This is a paragraph with red color text </P>

This code generates a paragraph which containing all text with red color.

Internal CSS writes directly on the header section of every HTML file using the tag <style>. Its effects on the whole page.

Syntax:

Tutorial at home
Tutorial at home

<style type=”css/text”>
P
{

Color:red;
align: justify;
}
</style>

External CSS writes to an external file. The extension of the CSS file is .css. All the CSS code is written within a .css file and link to the any HTML files using <link>. The <link> tag placed in the header portion of the HTML file.

<link rel=”stylesheet” type=”css/text” src=”abc.css”>

Here abc.css file placed in the same directory of HTML files (for Beginners’).

softetechnologies
    Author Details
Arnab De
I have over 16 years of experience working as an IT professional, ranging from teaching at my own institute to being a computer faculty at different leading institute across Kolkata. I also work as a web developer and designer, having worked for renowned companies and brand. Through tutorialathome, I wish to share my years of knowledge with the readers.
    Related Post
  Query About the post