Skip to page content

Portland Community College | Portland, Oregon Portland Community College

Menu
  • Get Started
  • Programs
  • Class Schedule
  • About
  • Student Life
  • Search
  • Resources
  • Contacts
  • Calendars
  • Give
  • Log in to MyPCC

Web services

PCC / Web services / Style guide / Basics /

Extras

These pages contain helpful information for developers, including classes controlling clearing, visibility, devnotes, and filler text. They also include Sass variables, mixins, and functions.

These pages are meant for developers with access to a page’s source code, not for content editors.

Clearing

How to reinstate the normal page flow.

Sections:

  • Simple clearing
  • Clearfix

Visibility

Hide or show elements based on certain parameters.

Sections:

  • True hide
  • Visually hide
  • Show or hide by screen size

沙巴体育官网ment

Keep organized during the development process.

Sections:

  • Blokk – lorem ipsum no more
  • Devnote
  • Watermarks

Sass variables

Stored values to make writing CSS easier.

Sections:

  • Borders, border-radius, and box-shadow
  • Breakpoints
  • Color
  • Text size
  • Transition time

Sass mixins

Chunks of styles to make writing CSS easier.

Sections:

  • Align form input and button
  • Background photo
  • Clearfix
  • Font Awesome
  • Font mixins
  • Shadows
  • Visually hide

Sass functions

CSS functions that make our website more responsive.

Sections:

  • General – px to rem
  • Font size – em
  • Font size – rem

Basics

  • Color
  • Typography
  • Icons
  • Extras
    • Clearing
    • Visibility
    • 沙巴体育官网ment
    • Sass variables
    • Sass mixins
    • Sass functions

Continue exploring PCC

Student essentials

  • Get started: Admissions
  • Paying for college
  • Academic calendar
  • Online Learning

On campus

  • Locations and maps
  • Transportation
  • Library
  • Bookstore

Connect

  • Jobs at PCC
  • Panther athletics
  • Guía en español
  • Panther Pride

Get help

  • Accessibility
  • Privacy policy
  • Get help with this website
  • Send website corrections

Copyright © 2000-2025 Portland Community College | Log in to the website editor
An Affirmative Action Equal Opportunity Institution

  • PCC Facebook
  • PCC Bluesky
  • PCC Instagram
  • PCC YouTube