If you want to improve the appearance of your website or blog, then CSS (Cascading Style Sheets) is essential to learn. With CSS, you can easily style web pages and make them look professional. The good news is, you do not need to be a professional web designer or developer to get the hang of CSS. In fact, there are several easy CSS code examples that you can learn in only 10 minutes. Here are some of them.

1. Changing Font Style

Changing font style using CSS is one of the easiest things you can do. In this example, we will change the font style of a paragraph.

“`css

p {

font-family: Arial, sans-serif;

}

“`

2. Changing Font Size

You can also easily change the font size of text using CSS.

“`css

p {

font-size: 18px;

}

“`

3. Changing Font Color

Changing the color of the text is also simple.

“`css

p {

color: #333;

}

“`

4. Adding Background Color

Adding a background color to a web page can change the look and feel of a site.

“`css

body {

background-color: #f2f2f2;

}

“`

5. Adding Borders

Adding a border to an element is also easy.

“`css

img {

border: 2px solid #333;

}

“`

6. Changing Link Colors

Customizing the color of your website’s links are essential to make them noticeable.

“`css

a {

color: #6f85a6;

}

“`

7. Adding Padding and Margin

Spacing is essential to make sure that web elements look aesthetically pleasing.

“`css

.container {

padding: 20px;

margin: 30px;

}

“`

8. Making an Element Float

Floats are used to make a website’s appearance look more dynamic.

“`css

img {

float: left;

}

“`

9. Making an Element Responsive

Responsive design is crucial for websites today since most users browse using both desktop and mobile devices.

“`css

.container {

width: 100%;

max-width: 800px;

}

“`
10. Adding Text Shadow

Adding a shadow to text can make it stand out more on a page.

“`css

h1 {

text-shadow: 2px 2px 4px #000;

}

“`