Text will have the same font-size on desktop and mobile devices. When you have a quite big headline, it might be a good idea to have a smaller headline on mobile devices so the headline doesn't run over the whole screen.
Even if you are not that familiar with CSS, we can guide you to change the font-size or other style elements with CSS in Skins.
Click at the text you want to change to see what class the text has applied. When the text has the class Heading 1, you should use H1 in the CSS.
Heading 1 » H1
Heading 2 » H2
Text 1 » P1
Text 2 » P2
Link 1 » L1
Link 2 » L2
Header Header » HeaderH
Header Text » HeaderP
Header Link » HeaderL
Footer Header » FooterH
Footer Text » FooterP
Footer Link » FooterL
Then you go to Skins, either directly to the tab Scripts or, if you just want to change the style for a project, select the project first.
In Scripts go to Email > CSS where you can add the code. When for example Heading 1 should be 18px on mobile devices, add the following code:
@media screen and (max-device-width: 480px), screen and (max-width: 480px) {
.H1 {font-size: 18px !important;}
}
When you also want to have the main text to be in an other size and color, you can add the code:
@media screen and (max-device-width: 480px), screen and (max-width: 480px) {
.H1 {font-size: 18px !important;}
.P1 {font-size: 14px !important; color: #333333;}
}
You can copy & paste the code examples from above, just change the class name to the one you need and the value you want to have.
Save the changes you made, reload your email draft or boilerplate, go to Test (or Summary), choose the Smart phone as device for the preview and you will see the changes.
You can also add text style that is not possible to set in Skins > Style, in Scripts > Email > CSS. If you want to change the style for all devices, the media query it nit necessary and you add e.g. just
.H1 {text-shadow: 2px 2px #FF0000;}
if you want to give the Heading 1 a red shadow.
Just remember that not all CSS properties work in email and not all email clients support CSS (like Outlook on Windows - there the Heading 1 would display without the shadow).