Help:Studyplace CSS
From Studyplace
You can easily enhance the look of your pages, while remaining consistent with the overall StudyPlace look and feel by using one of our cascading style sheet (css) classes. This help document explains the major styles that are available to you and points to examples of where there are used.
Contents |
banner
The banner style gives you a shaded section title. Use it with the div tag and it will stretch across the screen, use it with the span tag and it will only stretch to the size of your text.
Usage: <div class="banner">This is a title</div>
Example:Usage: <span class="banner">This is a title</span>
Example:
citation
The citation class offers APA Style hanging indentations. You may choose to use the ref tag instead.
Usage: <div class="citation">Benkler, Y. (2006). The wealth of networks: How social production transforms markets and freedom. New Haven: Yale University Press.</div>
Example:
highlight
The highligh class highlights text with a yellow background (i.e. like a highlighter might).
Usage: This is an<span class="highlight"> important sentence </span> that I typed.
Example: This is an important phrase that I typed.
nav-right
nav-right is appropriate for making a sub-navigation side-bar.
Usage:
<div class="nav-right"> Navigator
- link one
- link two
- link three
footer </div>
Example: (see gray box floating to the right)
quote
The quote class formats a quotation to make it more prominent. When such prominence is unwarranted, you can use the standard html blockquote tag.
Usage:
<div class="quote">
"But what about the upbringing and education of our guardians? What form will those take? Will looking into that question be of some use to us in finding the answer to our main enquiry, which is how justice and injustice arise in a city?"
Plato, The Republic 376c-d.
Trans. Tom Griffith
</div>
Example:
"But what about the upbringing and education of our guardians? What form will those take? Will looking into that question be of some use to us in finding the answer to our main enquiry, which is how justice and injustice arise in a city?"
Plato, The Republic 376c-d.
Trans. Tom Griffith
shaded
The shaded class gives you text in a shaded box.
Usage: (with div)
<div class="shaded">your shaded text goes here</div>
Example:
Usage: (with span) <span class="shaded">your shaded text goes here</span>
Example:
your shaded text goes here
sidebar
The sidbar class is similar to the nav-right class in that it creates a right-aligned call out. Stylistically it is distinguished using color and style from the navigation and is suitable for non-navigation sidebars.
Usage:
<div class="sidebar">
Poll results:
----
- 12% Strongly Agree
- 30% Agree
- 30% Neutral
- 10% Disagree
- 8% Strongly Disagree
</div>
Example:
See the lightblue box with "Poll Results" to the right.
Except where