Introduction to CSS and syntax

Web Client

CSS stands for Cascading Style Sheets. It’s a technology that is used to design a website or web application. If we consider a human body, the skeleton of our body is compared to Html for a website, and our skin and hair are compared to CSS for a website. It means that we can design a website in various types with the help of CSS. We can add various colours, different fonts, different icons, etc. In another way, we can say that CSS is a style sheet language that you can use for describing the look and formatting of a document written in a markup language.

CSS defines how the HTML elements are to be displayed. You can normally save styles in external (.css) files. External style sheets allow you to change the appearance and layout of all the pages in a Website just by editing one single file.

Some benefits are listed below for which we use CSS

  • Facility for Offline Browsing: CSS can store web applications locally with the help of an offline cache. Using this, we can view offline websites.
  • Superior styles to HTML: CSS has a much wider array of attributes than HTML, so you can give a far better look to your HTML page in comparison to HTML attributes.
  • Fit for Search Engines: CSS is a clean coding technique, which means search engines won’t have to struggle to “read” its content.
  • Maintenance is easy: To make a global change, simply change the style, and all elements in all the WebPages will update automatically.
  • Time-saving: You can write CSS once and reuse the same sheet on multiple HTML pages.
  • Global web standards − Now, HTML attributes are being deprecated, and experts recommend to use CSS. So it’s a good idea to start using CSS in all the HTML pages to make them compatible with future browsers.
  • Platform Independence− The Script offers consistent platform independence, which means you can use it in any operating system.

Syntax

A CSS comprises style rules that the browser interprets and then applies it to the corresponding elements in our document. A style rule set consists of a selector and declaration block. We can say that,

  • The selector points to the HTML element you want to style.
  • The declaration block contains one or more declarations separated by semicolons.
  • Each declaration includes a CSS property name and a value, separated by a colon.

As we can say-

  • Colour is property, and blue is value.
  • Font-size is property and 50px is value.
  • A CSS declaration always ends with a semicolon, and it surrounds the declaration blocks by curly braces.

As like –

  • Another example we can take-

ab {

background color: blue;

color: white;

}

Here it means, in this container, where the elements are present, the background colour will be blue, but the letters or sentences will be white.

Leave a Reply

Your email address will not be published. Required fields are marked *