Search the Help Center
  1. SendPro
  2. Getting started
  3. The basics of email

Articles in this section

See more

What is CSS?

CSS (Cascading Style Sheets) is a stylesheet language used to describe the look and formatting of a document written in HTML. CSS allows you to apply styles such as fonts, colors, and layout to your HTML documents, and can be used to create visually appealing and professional-looking web pages and emails.

To use CSS in an email, you will need to include the CSS styles in the HTML code for the email. There are two main ways to do this:

  • Inline styles: Inline styles are styles that are applied directly to an HTML element using the "style" attribute. For example:
<p style="color: red; font-size: 14px;">This is a paragraph with inline styles.</p>

To use inline styles in an email, you will need to include the CSS styles for each element directly in the HTML code for the email. This can make the HTML code more difficult to read and maintain but is generally the most reliable way to apply styles in emails.

  • Embedded styles: Another option is to use embedded styles, which are styles that are defined in the "style" element within the "head" element of the HTML code. For example:
<head>
 <style>
  p { 
     color: red; 
     font-size: 14px; 
    } 
 </style>
</head>

To use embedded styles in an email, you will need to include the CSS styles in the "style" element of the HTML code for the email. This can make the HTML code easier to read and maintain but is not supported by all email clients.

Limitations in CSS

There are a few limitations to using CSS in emails:

  1. Limited support: While most email clients support some basic CSS, they do not support all CSS properties. This can make it difficult to achieve complex layouts and styling in emails.

  2. Inline styles only: To ensure that your styles are applied correctly in emails, you will need to use inline styles rather than linking to an external stylesheet. This can make the HTML code more difficult to read and maintain.

  3. Email-safe fonts: Not all fonts are supported by all email clients, so it's a good idea to use "email-safe" fonts that are widely supported.

  4. Compatibility with HTML email: Some CSS properties may not work correctly when combined with certain HTML elements in emails. It's a good idea to test your email design with a variety of different email clients to ensure that it is displayed correctly.

Overall, CSS can be a powerful tool for styling and formatting emails. Still, it is important to be aware of these limitations and to test your emails in a variety of different email clients to ensure that they are displayed correctly.