Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views : Ad Clicks : Ad Views :
The Tech Art

The Tech Art – Download App for PC, Gaming News, Mobiles, Reviews, How to Guides, Technology News, Downloads, Tips & Tricks

Home / How To Stuffs / CSS, What Is It?

CSS, What Is It?

CSS, What Is It?

CSS, What Is It? Why do we use it, in this article we will get a basic understanding about the concept behind the code that’s influencing our sites today.

More and more web developers are ditching tables and coming around to the idea of using CSS to control the layout of their site. Over the last 10 years there have been hug jumps in the things you can do with CSS. With the many benefits of using CSS, such as quicker download time, improved accessibility and easier site management, it has gained wider acceptance.

The Cascading Style Sheets is a stylesheet language used to describe the presentation of a document written in a markup language like HTML and XML. It is used to enable readers of web pages to define colours, fonts, layout and other aspects of objects present on the web page. There are lots of YouTube videos and site on the net that can help you get good knowledge about this language.

CSS has a simple syntax and uses English keywords to specify the names of various style properties. For a beginner, it is very easy to understand. A style sheet consists of a set of rules. Each rule or rule-set consists of one or more selectors and a declaration block. A declaration-block consists of a list of semicolon-terminated declarations in curly braces. Each declaration itself consists of a property, a colon (:), a value, then a semi-colon (;). Below is a example what simple CSS code looks like and what the general structure is.


css example code



Before the introduction of CSS, mistakes were more common with all the attributes related to the presentation aspects were written within the markup language. This resulted in lengthy HTML code. There was also duplication of tasks leading to wastage of time and space. But, Cascading Style Sheets allows authors to move much of that information to a separate stylesheet resulting in considerably simpler HTML markup. So, you will get faster downloading of web pages.

Historically the main problem with using CSS has been lack of browser support. This is no longer the case with browsers in today’s world, which all have good support for CSS, now we can say that over 99% of site use CSS in the form on inline or an external file. There are always a few old sites out there that are just left outdated. Instead, the problem is that browsers can sometimes interpret its commands in different ways, causing developers to throw their arms up in the air and switch back to pixel-perfect table layouts.

This is what most web developer call cross browser compatibility issues.

code on computer screen


Safari will display it slightly different than Edge and IE 8 will be different then IE 10, but all could be different then Chrome. But by learning more about this style sheet language you’ll slowly start to understand the different browser interpretations and realise that the drawbacks aren’t really that many. But there are many ways to code the CSS to make it more compatible across all browser then it there was 7 years ago. With every year more and more updates and frameworks available to use that sit on top of the CSS, making it even more easier like BootStrap

If you want to learn CSS to get a better understanding there are loads of site that have great learning material to get you on your way. For example, they have a great CSS Tutorial with examples and demo examples that you can play with.
Another great why to learn CSS is via the Codecademy . They have both a paid and free version of their learning but free version is enough to get you started. But always remember that there are also YouTube videos that can help you jump into the world of the CSS.

  • Facebook
  • Twitter
  • Google+
  • Linkedin
  • Pinterest

Leave a Comment

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

This div height required for enabling the sticky sidebar