CSS Tutorial WEB Technology

CSS Tutorial

CSS is used to control the style of a web document in a simple and easy way.

CSS is an abbreviation for “cascading style sheet”. This tutorial covers both CSS1, CSS2 and CSS3 versions and gives a complete understanding of CSS, starting from its core to advanced concepts.

What is CSS

CSS is for cascading style sheets. It is a style sheet language used to describe the form and formatting of a document written in markup language. This provides an additional feature to HTML. It is commonly used to change the style of web pages and user interface with HTML. It can also be used with any type of XML documents including plain XML, SVG and XUL.

Most websites use CSS and HTML along with JavaScript to create a user interface for web applications and many mobile applications.

What does CSS do

  • You can add new forms to your old HTML documents.
  • You can change the appearance of your website with only a few changes to the CSS code.

Why use CSS

These are the three major benefits of CSS:

1) Solves a big problem
Before CSS, tags such as font, color, background style, element alignment, border and size had to be repeated on every web page. It was a very long process. For example: If you are developing a large website, where fonts and color information is added to each page, it will become a long and expensive process. CSS was created to solve this problem. This was a recommendation of the W3C.

2) Saves a lot of time
CSS style definitions are saved in external CSS files, so it is possible to change the entire website by changing just one file.

3) Provide more qualities
CSS provides more detailed features than plain HTML to define the look and feel of a website.

 

Hello World using CSS.

Just to give you a little excitement about CSS, I am going to give you a small traditional CSS Hello World program, you can try it using the demo link.

<!DOCTYPE html>
<html>
   <head>
      <title>This is document title</title>
      <style>
      h1 {
         color: #36CFFF; 
      }
      </style>
   </head>	
   <body>
      <h1>Hello World!</h1>
   </body>	
</html>

Applications of CSS

As mentioned earlier, CSS is the most commonly used style language on the web. I am going to list some of them here:

  • CSS saves time – you can write CSS once and then reuse the same sheet in more than one HTML page. You can define a style for each HTML element and apply it to as many web pages as you want.
  • Pages load faster – if you’re using CSS, you don’t have to write HTML tag attributes every time. Just write a CSS rule of a tag and apply it to all events in that tag. So less code means faster download time.
  • Easy Maintenance – To make a global change, simply change the style, and all elements in all web pages will be automatically updated.
  • Improved HTML Styles – CSS has a lot more detailed features than HTML, allowing you to give your HTML page a much better look than HTML features.
  • Multiple Device Compatibility – Style sheets allow content to be adapted for more than one type of device. Using the same HTML document, different versions of a website can be presented to handheld devices such as PDAs and cell phones or for printing.
  • Global Web Standards – HTML features are now being deprecated and recommended to use CSS. So it is a good idea to start using CSS in all HTML pages to make them compatible with future browsers.
Like/Subscribe us for latest updates or newsletter:

Leave a Reply

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