CSS stands for Cascading Style Sheets and is a styling and formatting language that makes it possible to define the appearance and design of HTML documents. It is therefore not concerned with the content of a website, but with the design or style of the page. With CSS, users can, for example, customize fonts, colors, lines, heights and widths on a website.
What are the advantages of CSS?
One advantage of the styling and formatting language is that separating content from presentation simplifies an HTML page. This makes it smaller and more structured. Another advantage is that CSS rules provide more design options than pure HTML. In addition, later changes are easier to implement with CSS. A fourth advantage is that CSS can be used to meet the requirements for websites that are both visually appealing and accessible. The use of CSS is also considered a quality characteristic of a professionally designed website.
What are the limitations of CSS?
One definite limitation of CSS is that not all browsers and not all devices understand stylesheet declarations or can display them correctly. In addition, all browsers have errors in their CSS implementations, meaning that even newer browsers do not always interpret standards-compliant CSS according to the standard. Another disadvantage is that there are limitations when integrating graphics and fonts.
Structure of CSS rules
A CSS rule consists of the specification of the element targeted by the rule: the CSS selector (e.g. an h1, p or div tag). It also consists of properties such as color and a value such as red, which are assigned to the element. CSS declarations (combinations of property : value) are placed inside curly braces and are separated from one another by semicolons.
The CSS rule instructs the browser to display text in h1 tags with a font size of 12px and in the color red.
How do you integrate CSS into a website?
CSS makes it possible to integrate internal and external stylesheets into an electronic document. In addition, there is also the inline style, where the desired properties are embedded directly into the HTML source code of an element.
Internal Stylesheets
Here, all CSS declarations are contained directly in the HTML file itself. For internal stylesheets, the “style” element is inserted into the “head” section of the HTML document as follows:
External Stylesheets
Here, the CSS declarations are defined in external files with the ".css" extension and included in the HTML file using a "link" tag. This cleanly separates the content from the design, making later changes very easy to implement. This is why this method is the most commonly used. The stylesheet is linked in the HTML document as follows:
Inline Style
Here, the CSS declaration is located directly in the HTML file, just as with an internal stylesheet. However, the corresponding attributes are located directly in the opening tag of the element and do not apply to any other element. This method is particularly useful when no general styling rules need to be applied.
Do you have any further questions about this topic? Or do you need help designing your website from a professional web agency in Munich? Then feel free to contact us!
