CSS CSS Tutorial CSS Advanced CSS Responsive Web Design(RWD) CSS Grid CSS Properties Sass Tutorial Sass Functions



all

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in HTML or XML. CSS is used to style web pages, user interfaces, and other types of computer applications. CSS properties are used to define the style and layout of elements on a web page or application. In this article, we will discuss some of the most commonly used CSS properties in computer applications.

Font Properties

The font properties in CSS are used to define the font family, size, weight, style, and color of text. The following code example shows how to use the font properties:

<p style="font-family: Arial, sans-serif; font-size: 16px; font-weight: bold; font-style: italic; color: #333;">This is a sample text.</p>

The above code sets the font family to Arial or any sans-serif font, font size to 16 pixels, font weight to bold, font style to italic, and text color to #333.

Background Properties

The background properties in CSS are used to define the background color, image, and position of an element. The following code example shows how to use the background properties:

<div style="background-color: #f2f2f2; background-image: url('image.jpg'); background-position: center;">This is a sample text.</div>

The above code sets the background color to #f2f2f2, background image to image.jpg, and background position to center.

Border Properties

The border properties in CSS are used to define the border style, width, and color of an element. The following code example shows how to use the border properties:

<div style="border: 1px solid #ccc;">This is a sample text.</div>

The above code sets the border style to solid, border width to 1 pixel, and border color to #ccc.

Padding and Margin Properties

The padding and margin properties in CSS are used to define the spacing around an element. The padding property defines the space between the element's content and its border, while the margin property defines the space between the element's border and the adjacent elements. The following code example shows how to use the padding and margin properties:

<div style="padding: 10px; margin: 10px;">This is a sample text.</div>

The above code sets the padding and margin to 10 pixels.

Positioning Properties

The positioning properties in CSS are used to position an element on a web page or application. The following code example shows how to use the positioning properties:

<div style="position: absolute; top: 50px; left: 50px;">This is a sample text.</div>

The above code sets the position to absolute, and the top and left properties to 50 pixels.

Text Properties

The text properties in CSS are used to define the text alignment, decoration, and transformation. The following code example shows how to use the text properties:

<p style="text-align: center; text-decoration: underline; text-transform: uppercase;">This is a sample text.</p>

The above code sets the text alignment to center, text decoration to underline, and text transformation to uppercase.

Reference

Activity