Check Out Joomla Blog
Joomla CSS - list of styles used in Joomla
(3 votes)

This is a list of all the available css styles Joomla 1.0.x uses - Please feel free to email us if you discover anything we have missed.

Note: This is only a list of the styles that are predefined in Joomla - you can of course create your own custom styles when designing your layout. This list is useful for identifying the CSS for a specific item - example: if you wanted to create a custom style for the heading of a content item you can browse through this list and you'll probably notice .componentheading and .contentheading stand out as strong contenders for the style you'll want to customize.

 We usually start with this list when creating a new template and fill in the blanks.

 Another good tip is to check the source code of your site often while you build - once you have a beta template in place you can view the source and look at the class that Joomla is applying to the element that you want to style and then add this style to your CSS file. FireFox is a great browser for this - hotkey: CTRL U brings up the page source instantly.



 
/* Blank CSS template for Joomla 1.0.x */
.adminform {
}
.article_seperator {
}
.back_button {
}
.blog {
}
.blog_more {
}
.blogsection {
}
.button {
}
.buttonheading {
}
.category {
}
.clip {
}
.componentheading {
}
.contact_email {
}
.content_rating {
}
.content_vote {
}
.contentdescription {
}
.contentheading {
}
.contentpagetitle {
}
.contentpane {
}
.contentpaneopen {
}
.contenttoc {
}
.createdate {
}
.dtree {
}
.dTreeNode {
}
.editlinktip {
}
.expander {
}
.highlight {
}
.inputbox {
}
.item {
}
.latestnews {
}
.message {
}
.message {
}
.modifydate {
}
.module {
}
.moduletable {
}
.mosimage {
}
.mosimage_caption {
}
.mostread {
}
.newsfeed {
}
.node {
}
.pagenav {
}
.pagenav_next {
}
.pagenav_prev {
}
.pagenavbar {
}
.pagenavcounter {
}
.paramlist {
}
.pathway {
}
.poll {
}
.pollstableborder {
}
.profiler {
}
.readon {
}
.row1 {
}
.row2 {
}
.search {
}
.searchintro {
}
.sectiontableentry1 {
}
.sectiontableentry2 {
}
.sectiontablefooter {
}
.sectiontableheader {
}
.small {
}
.smalldark {
}
.syndicate {
}
.syndicate_text {
}
.tab {
}
.tabclass1 {
}
.tabclass2 {
}
.tab-page {
}
.text_area {
}
.toclink {
}
.toolbar {
}
.tooltip {
}
.wrapper {
}

 

Thanks to Chette for the original list - she has also provides an excellent Joomla Template Tutorial on her site that is very good for beginners.

  
 
 
< Prev   Next >
[ Back ]

Show Love - Donate

Enter Amount:

Who's Online

We have 7 guests and 3 bears online

Login/Register

Login


Latest Templates

  • PolarBearPro - Chromatic Edition 
  • PolarBearPro - Joomla 1.5 
Adobe CS4 Master Collection
youtube , youtube