CSS styles

C

Css is a stylization language for html elements, html tags. The name CSS comes from the expression Cascading Style Sheets. In modern Web Design, only CSS is used to style web pages. This means that from the color of the letters and the background to the positioning of the elements on a web page, everything is stylized through CSS. The styles used on a page can be embedded in that page or can be called from external files, css files.

With the help of CSS styles we can style entire web sites from a single file. These results in less code, which will make pages load faster. If in the future we want to make a change on the site, we will not have to edit each page, article separately, but we will modify a single file, the external .css file.

The CSS gives us the freedom to overwrite an already defined style, because it works with a certain hierarchy, that is:

1: – The first time the style defined in the external file will be taken into consideration, after which

2: the style defined in the head part, and the last date

3: with the inline css, that is the style defined in an html tag using the style attribute. We can overwrite any previously defined style.

CSS Font styles:

font-family is actually a list of fonts that the browser will use in the order in which it recognizes them (the first one used will be the first one in the list, if it is not recognized it uses the second one and so on). It is recommended that the last position in the list be a generic font (for example, serif, sans-serif or monospace).

font-size
It is the parameter by which we determine the font size, expressed in pixels (px), points (pt), keywords or percentages. It has an operation similar to the <font> tag.

font-style
font-style is used to add the italic font to the font. Can take normal and italic values.

CSS Text styles:

Text-align places objects (eg text or images) horizontally and supports the left, right and center values as well as the align tag in HTML.
The following is an example of the code used in HEAD, applied to the label p:

<style type=text/CSS”>
<! —
p{text-align: center;}
–>
</style>

Text-indent is used to align the text inside having values expressed in inches (in), centimeters (cm) or pixels (px).
In the example below text-indent is applied to the label p by moving the text with 10 pixels inside

<style type=”text/css”>
<! —
p{text-indent: 10px;}
–>
</style>

text-decoration adds the underline or cut of the associated text block and can have the values underline, line-through or none.

Color defines the color of the text in an area or the entire page.

Styles for ties

In HTML the color of the links can be set by the LINK, ALINK and VLINK attributes declared inside the BODY tag.

• a:link defines the style of the blind link
• a:visited defines the style of the visited link
• a:active defines the style of the active link (not used very much)
• a:hover defines the style when the mouse is above the link

About the author

Ilias spiros
By Ilias spiros

Recent Posts

Archives

Categories