Custom styling is a must in my world. Sometimes I may put a bit of code in a post, or a note and like them to stand out from the rest of the post. That is why I’ve added custom styling to PocketT for everyone else to use. This means users won’t have to create their own styles (unless they want to change the style or create more).

Notes

The class name for notes is, well, “note” and it looks like below. It has a background colour/image and borders on the top and bottom, as well as smaller text from the rest of the body of the post. This is because it’s a note.

Nunc malesuada, lacus quis semper vestibulum, orci sem eleifend metus, scelerisque placerat sem nibh quis purus.

To add this class to something you want to class as a note, simply use p class="note". Simple.

Code Samples

Some people post code bits in their post. Maybe it’s CSS or PHP, but whatever it is, it looks better with some separate styling.

.codebit {
margin:0 10px;
border-left:3px solid #9CAA17;
padding:5px;
}

For code snippets you can use p class="codebit"

Downloads

And of course, there are some of us that have downloads in some of our articles or pages and some styling doesn’t go astray.

Download Something

That would be p class="dl".

Word Highlighting

I like to highlight certain words sometimes. It kind of adds key words without them truly being key words. They just stand out to make a point to the person reading them.

Nunc malesuada, lacus quis semper vestibulum, orci sem eleifend metus, scelerisque placerat sem nibh quis purus.

For these, all you need to use is span class="green" or span class="grey"

This entry was posted on Saturday, March 8th, 2008 at 2:41 am and is filed under 无聊. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.