CSS for plurk

Here I'm compiling information about using CSS to modify the appearance of your plurk profile page, partly as a way of taking notes for myself, and to share this information with other plurkers not familiar with CSS.

Some background

CSS (cascading style sheets) is a way to define the appearance of a web page, in conjunction with the HTML, which defines the content. The format of a CSS definition is:

someelement { property: value; property2:value2; etc.. }

For example, if you want to make your timeline's background a bright red (represented in hex code as #f00) with bright green text (#0f0), you would have this:

#timeline_holder { background:#f00; color:#0f0 }

and your page will be really hard on the eyes.

So that's pretty much all you need to know to start using CSS - find out what you want to customize (ie the element) and how you want to customize it (ie properties and their values).

» More about CSS

Before you begin...

Before you start fiddling with your plurk css, you should pick a built-in theme that matches what you have in mind for your design. If you have a dark page, pick a dark background/timeline/dashboard theme as appropriate. What this will do is give you a good baseline color scheme to start modifying. If you don't match this up, you'll have more work ahead of you getting colors right and preventing black-on-black or white-on-white situations.

The (incomplete) anatomy of a plurk page

Click here to see a far-from-complete map of elements on a plurk profile page for your tweaking desires.

Tips & Tricks

coming soon