CSS is a language used for describing the presentation of a document written in a markup language, such as HTML. The webpage on which you are reading this is structured using the markup language HTML, and presented to you by CSS. No, they are not our sponsors.
Oh wait, did I to tell you what the acronym CSS stands for. CSS expands as Cascading Style Sheets. It basically dresses up your webpage.
The cascading in Cascading Style Sheets refers to how property values are applied in the context of the parent/child hierarchy of the Web document. A style sheet is the encapsulation of style rules in a centralized location, either in the head section of the HTML document or in a separate linked file. I will
You can use it to define styles for your documents, including the design, layout and variations in display for different devices and screen sizes. You can add colour, headings, pictures, borders, margins, games (yeah, you read that right), attractive effects, the list is endless.
You can do virtually everything with your webpage with CSS at your disposal. Well, it still won’t be able to shield you from any GOT spoilers, just saying.
Let me show you what I am talking about, this is the before and after comparison of the website on which you are enjoying(hopefully) this blog —
Now observe the picture carefully.
It’s no magic. It’s just CSS playing its game. You can look at the enormous difference addition of CSS has made to the webpage.
So, let’s see how you can incorporate CSS in your webpage.
There are three ways to integrate CSS into your website:
- You can place your CSS in the <head> of a document with an embedded style sheet.
<style media="screen" type="text/css"> Add style rules here </style>
2. You can attach a separate file that defines your styles with an external style sheet.
To link an external style sheet to your document, simply add a link to the style sheet in the <head> of the document.
An external style sheet has many advantages. Keeping the styles separate from your HTML content:
- helps avoid duplication
- makes maintenance easier
- allows you to make a site-wide change in one place
3. or you can import a CSS file from within CSS. To import a new CSS file from within CSS simply use the following rule:
Some of the benefits which make CSS essential to your webpage are —
· Consistency: By making one change to your website’s CSS style sheet, you can automatically make it to every page of your website. The bigger your website, the more time CSS saves you.
· Bandwidth Reduction: When CSS separates your website’s content from its design language, you dramatically reduce your file transfer size. Your CSS document will be stored externally, and will be accessed only once when a visitor requests your website.
. Search Engines: CSS is considered a clean coding technique, which means search engines won’t have to struggle to “read” its content. Also, using CSS will leave your website with more content than code — and content is critical to your search engine success.
· Viewing Options: Another common web design concern is the increasing need to make websites available for different media. CSS can help you tackle this challenge by allowing the same markup page to be presented in different viewing styles — for example, you may create a separate stylesheet for print or for a mobile device.
So, taking all these facts into consideration, we can say that CSS truly cannot be taken for granted. It’s one of the most essential part of any website and will continue to remain so.
To sign up for our upcoming workshop, click below.
Upcoming Workshops at HelloMeets-
Hacker Noon is how hackers start their afternoons. We’re a part of the @AMI family. We are now accepting submissions and happy to discuss advertising & sponsorship opportunities.If you enjoyed this story, we recommend reading our latest tech stories and trending tech stories. Until next time, don’t take the realities of the world for granted!