What is CSS?

CSS stands for Cascading Style Sheets, often seen as the more creative aspect of HTML. CCS controls web layout, colour, fonts, spacings, responsiveness of a site and more. HTML forms the base of what will be displayed, while CSS is how this will be displayed on the web. A few feature of CSS is accessibility, as sites designed with this are responsive on a range of browsers, devices and screen sizes.

Why use CSS?

Cascading Style Sheets is a tool with a wide range of benefits and advantages.

Firstly, the most obvious yet significant reason that CSS is such a commonly used tool, is to make web content more visually appealing. From my personal research, I found that websites before CSS was introduced solely used HTML, so were very blocky and text-heavy, which weren’t very user-friendly or visually interesting. Cascading Style Sheets were one of the largest steps forwards in web design and movement towards Web 2.0, leading to the visually interesting sites that we see today.

CSS allows different sites to have their own identity and characteristics. If websites didn’t have images, fonts and different layouts, they would all have the same simple and quite boring look with no personal touch. Differences in these are what give websites their personality and identity, allowing users to differentiate them.

Finally, CSS creates more user-friendly design. Content that is easily digestible, including images, colours and layouts to support the content, is more popular amount users in comparison to a plain site. Cascading Style Sheets are a great tool for reaching this outcome as, as mentioned above, it is the key tool in creating visually interesting designs.

I found covering the reason for choosing CSS very helpful for myself. Of course I knew what CSS was, however I’d never really looked at the reason for why it is used. I feel that CSS was one of the most significant steps forwards in web design, as without is we would have never developed to have the wide range of websites with unique features and appearances that we have today.

Advantages of CSS

Anatomy of CSS

To edit information, there is a selector to determine what content is being changes and where, and then a rule within two curly brackets ({ }). Together, this creates a rule.

For some changes, such as font changes, there is a property which explains the type of information, followed by a value that names it. For example: {font-family: Arial}

Together, this is what these may look like in a line of CSS:

image.png

Writing Rules

We looked at the rules for writing and laying out CSS. This was mainly based on the placemebt of the brackets, property and values. An example of the correct way to lay a section of CSS out is: