HTML 
CSS 
PHP 
JavaScript 
SQL 
Bootstrap 
Solidity 
jQuery 
Git 
Chrome DevTools 
C++ 
Python Contents
How to change font in CSS
By using the CSS font property, you can define a set of value for the text font:
Example
p.arial-font {
font: 14px arial, sans-serif;
}
p.georgia-font {
font: italic bold 16px/32px Georgia, serif;
}This property is actually a shorthand for seven subproperties:
- font-stretch
- font-style
font-variant- font-weight
- font-size
- line-height
- font-family
The syntax for CSS text styling
To use the CSS fontshorthand, you need to define the subproperties in a certain order:
font: strech style variant weight size/line-height family;
The only values you must specify to make CSS set font properties are size and family. Other values are optional: if you skip them, the default values will be used instead.
| Value | Default value | Explanation |
|---|---|---|
| stretch | normal | Defines if the text is condensed or stretched |
| style | normal | Defines if the text is italic or oblique |
| variant | normal | Defines if the text is in small caps |
| weight | normal | Defines the thickness of the characters |
| size | medium | Defines the height of the characters |
| line-height | normal | Defines the height of empty spaces between the text lines |
| family | Depends on the browser | Defines the font for the characters |
Note: the line height must be defined after the font size with a forward slash between these two values (e.g.,
20px/20px).
Pros Main Features
- Easy to use with a learn-by-doing approach
- Offers quality content
- Gamified in-browser coding experience
- The price matches the quality
- Suitable for learners ranging from beginner to advanced
- Free certificates of completion
- Focused on data science skills
- Flexible learning timetable
Pros Main Features
- Simplistic design (no unnecessary information)
- High-quality courses (even the free ones)
- Variety of features
- Nanodegree programs
- Suitable for enterprises
- Paid Certificates of completion
Pros Main Features
- A wide range of learning programs
- University-level courses
- Easy to navigate
- Verified certificates
- Free learning track available
- University-level courses
- Suitable for enterprises
- Verified certificates of completion
Using keywords for CSS fonts
Instead of defining each subproperty individually, you can also use keywords to make CSS set font styles:
Example
<ul>
<li style="font: caption;">Captioned Control Font.</li>
<li style="font: icon;">Icon Label Font.</li>
<li style="font: menu;">Dropdown Menu Font.</li>
<li style="font: message-box;">Dialogue Box Font.</li>
<li style="font: small-caption;">Smaller Caption Font.</li>
<li style="font: status-bar;">Status Bar Font.</li>
</ul>Find all the available values in the table below:
| Value | Description |
|---|---|
| caption | CSS fonts used for captioned controls such as controls and buttons |
| small-caption | A smaller version of the caption font |
| icon | CSS fonts used for icon labels |
| menu | CSS fonts used for various menus |
| message-box | CSS fonts used for dialog boxes |
| status-bar | CSS fonts used for window status bars |
Browser support
Chrome
1+
Edge
12+
Firefox
1+
IE
5.5+
Opera
7+
Safari
1+
Mobile browser support
Chrome
18+
Firefox
4+
Opera
10.1+
Safari
1+
