What is: CSS Style Language

By Dmytro Spilka

Sep 19, 2017

 

Peter Jobes

<link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css"><!-- [et_pb_line_break_holder] --><style type="text/css"><!-- [et_pb_line_break_holder] --> #mc_embed_signup{background:transparent; clear:left; font:12px Helvetica,Arial,sans-serif; width:100%;}<!-- [et_pb_line_break_holder] --> /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.<!-- [et_pb_line_break_holder] --> We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */<!-- [et_pb_line_break_holder] --></style><!-- [et_pb_line_break_holder] --><div id="mc_embed_signup"><!-- [et_pb_line_break_holder] --><form action="https://solvid.us13.list-manage.com/subscribe/post?u=5164852564d3ba7103743bc16&id=fa1473dcff" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><!-- [et_pb_line_break_holder] --> <div id="mc_embed_signup_scroll"><!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="Sign up for regular updates" required><div class="clear"><input type="submit" value="" name="subscribe" id="mc-embedded-subscribe" class="button"></div><!-- [et_pb_line_break_holder] --> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups--><!-- [et_pb_line_break_holder] --> <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_5164852564d3ba7103743bc16_fa1473dcff" tabindex="-1" value=""></div><!-- [et_pb_line_break_holder] --> </div><!-- [et_pb_line_break_holder] --></form><!-- [et_pb_line_break_holder] --></div>

Definition of CSS (Cascading Style Sheets)

Cascading Style Sheets (CSS) is the style language that describes the layout of HTML elements such as fonts, margins, colours, height, width, backgrounds, etc. Controlling these from a single style sheet allows for consistency across the entirety of a website or blog.

Here is an example of typical CSS:

[pastacode lang=”css” manual=”.post-content%20p%7B%0A%09font-family%3A’Roboto’%2C%20sans-serif%20!important%3B%0A%09line-height%3A30px%3B%0A%09color%3A%230c0c0c%3B%0A%09font-size%3A16px%3B%0A%09font-weight%3A300%3B%0A%7D” message=”” highlight=”” provider=”manual”/]

While HTML is used to structure your content, CSS is used to format your structured content.

In the days before the inception of the formatting system, webmasters simply used HTML to set their site up on the fledgeling World Wide Web. The problem was that a developer had limited control of how their content was delivered online – with early HTML only offering prompts to write headline text and paragraphs. So when the Chief Technical Officer of Opera, Håkon Wium Lie, published a 1994 article entitled ‘Cascading HTML style sheets — a proposal,’ he was essentially firing the starting pistol for the revolution of how websites are viewed.

Since the implementation of the CSS formatting, users have been able to incorporate increasingly alluring layouts with precision and the convenience of embedding media links, too. Webmasters are also, significantly, able to add many different documents to the same page of text, paving the way for the world of blogging that we’re familiar with today.

Significantly, CSS allows us to run a consistent theme on a blogging platform in a way that keeps the layout, fonts and menus intact throughout however many pages your page may have.

Lie, The man behind the creation of CSS, has since spoken to Dev.Opera about the impact his idea had on HTML, claiming that a World Wide Web without Cascading Style Sheets would’ve left its users dependent on creating text filled images to express their creativity online: “In my first real publication on the web, I resorted to making images with text in it — you can see it in this publication from 1993. If this development had continued, the web would have become a giant fax machine where pictures of text would be passed along. This would have been terrible for blind users and search engines alike. CSS was proposed to prevent this development by giving authors a way to express their designs without adding new HTML tags.”

Tip: All blogging platforms utilise CSS, so be sure to get the most out of the freedom to design whatever you like in an appealing way to your readers. The beauty of the formatting options is that you can make your page as simple or elaborate as you want – just avoid cluttering your site with meaningless fancy backgrounds and widgets, and likewise, keep away from making your pages look plain and boring.

Further Reading:

1. Yellow Pencil: The Best Visual CSS Editor Plugin For WordPress

2. How To Easily Show Code Snippets On Your WordPress Website

Full Disclosure: This post contains affiliate links, which means that if you purchase or sign-up with one of the services, we may receive a commission.


Peter Jobes

Content Marketing Manager

Get free online marketing and blogging insights<br><!-- [et_pb_line_break_holder] -->Unsubscribe at any time<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><link href="//cdn-images.mailchimp.com/embedcode/horizontal-slim-10_7.css" rel="stylesheet" type="text/css"><!-- [et_pb_line_break_holder] --><style type="text/css"><!-- [et_pb_line_break_holder] --> #mc_embed_signup{background:transparent; clear:left; font:12px Helvetica,Arial,sans-serif; width:100%;}<!-- [et_pb_line_break_holder] --> /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.<!-- [et_pb_line_break_holder] --> We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */<!-- [et_pb_line_break_holder] --></style><!-- [et_pb_line_break_holder] --><div id="mc_embed_signup"><!-- [et_pb_line_break_holder] --><form action="https://solvid.us13.list-manage.com/subscribe/post?u=5164852564d3ba7103743bc16&id=fa1473dcff" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate><!-- [et_pb_line_break_holder] --> <div id="mc_embed_signup_scroll"><!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> <input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="Sign up for regular updates" required><div class="clear"><input type="submit" value="" name="subscribe" id="mc-embedded-subscribe" class="button"></div><!-- [et_pb_line_break_holder] --> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups--><!-- [et_pb_line_break_holder] --> <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_5164852564d3ba7103743bc16_fa1473dcff" tabindex="-1" value=""></div><!-- [et_pb_line_break_holder] --> </div><!-- [et_pb_line_break_holder] --></form><!-- [et_pb_line_break_holder] --></div>

Join 1000s of

using Solvid.

234 customers signed up in the last 30 days

SEO Accreditation Large

Solvid is a creative SEO, Content and Digital PR agency. Solvid is a registered trademark of Solvi & Heirs LTD, registered in England and Wales. Registered Address: 6 St. Davids Square, London, England, E14 3WA

VAT: GB 326425708

Reg: 09697233

020 7072 8788

hello@solvid.co.uk