Basics | Web services at PCC_欧洲杯决赛竞猜app

Web services

All websites use fonts, headings, paragraphs, and links. The following describes?how we handle them on the PCC website.

Stylesheet locations: /_source/styles/base/_typography.scss and /_source/styles/base/_mixins.scss
Use one of our Sass functions to set font size. See the following bullets for how to use the functions.
To set the font size, the syntax is:
- font-size:em($text-base);
  - This runs the em() function in /base/_mixins.scss and converts the font size to em.
  - The base font size on the PCC website is 16px (1em).
  - You can also use the rem function (a duplicate of the em function) where needed: font-size:rem($text-base);.
To change the font size, the syntax is:
- Decrease: font-size:em($text-base - 2); (ex. 16 – 2 = 14px)
- Increase: font-size:em($text-base + 4); (ex. 16 + 4 = 20px)
  - This runs the em() function in /base/_mixins.scss, calculates the new pixel size, and converts the calculated font size to em.
To set the font style and weight, use one of our Sass font mixins:
- regular: @include:$font;
- regular italic: @include:$font-italic;
- bold: @include:$font-bold;
- headings: @include:$font-heading;
There is no bold italic.

Heading levels and their usage on the website.

Sections:

Distinct sections of text, with space in between.