Skip Header
Teaching and Learning with Technology
Computing With Accents and Foreign Scripts
TLT Home : TLT Suggestions Skip Menu
LOCATION: Web Developers » Developing Tips » Superscript and Subscript

Superscript and Subscript

There are several approaches to displaying superscript and subscript text on the Web, and each have their uses depending on your needs.

This Page

  1. Microsoft Word
  2. HTML and CSS
  3. Using Unicode Values
  4. Unicode Chart - New Page

Microsoft Word

In Word documents (which can be transformed into PDF files), superscript and subscripts are font formatting options.

With Menus

  1. Highlight a section of text which will become superscript or subscript
  2. Go to Format then Font. Or press Control+D (Win) or Command+D (Mac).
  3. In the format palette, check the options for Superscript or Subscript as appropriate.

Keyboard Shortcut

Use these keyboard shortcuts to toggle superscript or subscript formatting on and off.

Top of Page

HTML and CSS

For most purposes, you can use the <sup></sup> tag to create super script text and <sub></sub> to create sub-script text. See examples below:

Code: x<sup>x+1</sup>
Result: xx+1

Code: x<sub>i+1</sub>
Result: xi+1

Note: Although some Web standards professionals recommend avoiding these tags, they are an official XHTML standard.

CSS Styles and the SUP/SUB Tags

You change the CSS attributes of the <sup> and <sub> tags to improve line spacing, formatting and placement of characters. See references below:

All CSS Instead?

Some Web standards professionals recommend using CSS formatting instead the <sup> and <sub> tags on the theory that these tags are "presentational." The disadvantage to this approach is that if a user disables your stylesheet, the superscripts and subscripts will disappear.

However, if you are more comfortable with using the CSS attributes, you can refer to these pages.

Top of Page

 

Using Unicode Values

Many common superscript and subscript characters have their own Unicode entries and entity codes. If your Web page is generated from a database or meant to be a searchable archive, the use of Unicode values may be preferable.

 

Top of Page

Tuesday, 02-Oct-2007 13:44:01 EDT