Hackernoon logoAn Introduction to CSS for Aspiring Web Designers by@gurbuzertunga

An Introduction to CSS for Aspiring Web Designers


CSS stands for “Cascading Style Sheets.” It is a formatting language that allows us to visually improve our HTML tags (size, color, font, etc.). As the name suggests, it does it by cascading.

How Many Style Page Types Does CSS Have?

Never fear. Never Surrender.

  1. Internal - This is the way we write our CSS code in the style tag at the top of the page.
  2. External - This is the syntax we use to open a document with a .css extension for our CSS codes. We write it here and then call this document into HTML with the link tag. The advantage of using an external .css file is that our HTML page will be easier to read and manage. Our biggest priority should always be to have a re-readable code. When working with a team of developers, you want the rest of the team to understand the code so they can make necessary changes. Even as a solo developer, separating your HTML and CSS tags will help you read your own code. There is nothing more humiliating to a coder than coming back from a weekend or vacation, looking at the screen and trying to understand YOUR OWN CODE. So, repeat after me, “I will separate my HTML and CSS files. I will add comments to my sections. I will always take a shower before starting to code.”
  3. In-line- This is the format in which we write our CSS codes in-line into our HTML structure.

What are the benefits of CSS?


CSS can make you a net ninja.

It offers the opportunity to make special changes for different browsers and devices types (tablets, mobile, etc.), making your site is compatible for all sizes.

You can maintain regularity by keeping the CSS codes you've written in a single file. This makes it easier to find a code or a line of code, both during construction and also later. Adding comments to sections of your CSS file may help you and fellow team members understand your code as well.

By adding color, order and flexibility to the sites we build, CSS allows us to attract more users. Instead of styling a tag one-by-one (for example, the entire p tag on the page), we can style all p tags by opening a single tag with CSS. In short, with CSS, we can save time and improve our site efficiently in terms of both design and flexibility.

Relationship between HTML and CSS:


Do not fear errors, for they will teach you CSS.

If we compare our work to human anatomy, HTML would be the skeleton. CSS would be the skin. In other words, after creating the main skeleton of our site with HTML, we provide appearance styles such as text colors and background colors with CSS. A kind of CSS is used to customize the look of the site. This is the relationship between HTML and CSS.

By mastering CSS, we can improve the appearance and experience of our site and save time doing it.

Previously published at https://medium.com/@gurbuzertunga/what-is-css-and-how-do-we-use-it-fde08e9a3c8a


Join Hacker Noon

Create your free account to unlock your custom reading experience.