User:Anthony cfc/studio/style

From Wikipedia, the free encyclopedia

Talk	Gallery	Email	Barnstars	Sandbox	User Page Design	Esperanza

Style	Border Color (e)
Style: defined as "...a particular kind, sort, or type, as with reference to form, appearance, or character..." ; that is what this page aims to do - set your userpage rolling with some character! This can be done from the grand and most visible features such as colour to the more subtle touches as rounded, expandable sections and top-corner links to your favourite articles.		Away In and Out Ready to Edit

Contents 1 Skins 2 Formatting 2.1 Layout themes 2.1.1 Article format 2.1.2 Menu format 2.1.3 Table formats 2.2 Format elements 2.2.1 Borders 2.2.2 Round corners 2.2.3 Color 2.2.3.1 Change page color with CSS 2.2.4 Contents 2.2.5 Scroll boxes 2.2.6 Show/Hide sections 2.2.7 Action links 2.2.8 Switched features 3 See also

[edit] Skins

• Gallery of user styles

[edit] Formatting

[edit] Layout themes

[edit] Article format

The default format for user pages is the article format. That is, standard headings, paragraphs, bulleted lists, etc. But an article-styled user page need not look drab, and is more than adequate for presenting information about yourself. Since it is so easy, it's a perfect place to start. See the following user pages as examples of well-developed user pages in article format:

• Antandrus' user page
• Schuminweb's user page
• Scout370's user page

[edit] Menu format

[edit] Table formats

• Main Page format
• Custom Portal format
• Custom table format
  • With menu
  • Without menu

[edit] Format elements

[edit] Borders

Border look nice. Borders add spice. And they're the right price.

The examples below include closing codes, which may make it difficult to utilize them on talk pages. To have borders and backgrounds extend to the end of the page regardless of what is added, simply leave off the closing codes (</div>, </tr>, </td>, |}) at the end of the border markup examples.

Some example borders:

---

The above design is best used for short pages, as it mimicks a picture frame. It would work well for images, awards, etc.

[edit] Round corners

As of November 2006, only Mozilla (Firefox) supports round corners. To add round corners to a box or frame, include the {{Round corners}}; template (just as shown, including semi-colon) as a style paramter. Note that the element to be rounded must have a border in the first place. Here's a markup example:

<div style="border:1px solid #5599FF; {{Round corners}}; margin: 5px;">
sample text sample text sample text sample text
</div>

To see the specific code for creating round corners, see Template:Round corners.

For a cool example of the use of round corners, see Zeerus' user page

[edit] Color

Main article: Web colors

Web colors	black	silver	gray	white	red	maroon	purple	fuchsia	green	lime	olive	yellow	orange	blue	navy	teal	aqua

[edit] Change page color with CSS

[edit] Contents

To suppress the automatic table of contents box from appearing on your userpage, place the following line somewhere on your userpage:

__NOTOC__

To have the table of contents box float to the right, place the following line where you want the toc to appear:

{{tocright}}

[edit] Scroll boxes

To create a scrollbox, use the "overflow:auto" style code. Be sure to also specify a "height: nnpx", where nn is the height you want. Here's an example of one 150px tall:

[edit] Show/Hide sections

Here's an example of collapsed/expandable sections:

[edit] Action links

[edit] Switched features

[edit] See also

Formatting Text

Formatting Pictures

Making Subpages

Title Headers

Suggested Tools