CSS Properties Tutorial – Part 2/2

Written by inAm from http://www.temptingmagazine.com on January 11th, 2010 | 0 Comments

Our second part of CSS properties tutorial consists of two very useful properties: Cursor and display inline. I will explain both these properties with example and coding.

So please leave comments below for further questions. Also, Keep a bookmark for more tutorials to come soon.

Cursor

If you change the behavior of a button, you should change its cursor as well. For example, when a button is disabled, the cursor should be changed to default (arrow) to indicate that it is not clickable. So, the cursor property is extremely useful for developing web apps.

.disabled {
cursor: default;
}

.busy {
cursor: wait;
}

.clickable:hover {
cursor: pointer;
}

Display inline / block

In case you didn’t know: block elements are rendered on a new line, whereas inline elements are rendered on the same line. <div>, <h1>, and <p> tags are examples of block elements. Examples of inline tags are: <em>, <span>, and<strong>. You can override the display style by specifying display: inlineor block.

.block em {
display: block;
}

.inline h4, .inline p {
display: inline;
}

Please share this post with others using bookmark icons below and Subscribe in readers : )

Related posts:

1. CSS Properties Tutorial – Part 1/2
2. 40+ Tooltips Scripts with AJAX, Javascript and CSS
3. Convert the Layout of Website Into HTML Template – Website Development Tutorial
4. PHP and MySQL Programming Tutorial
5. Table Layouts vs Div Layouts and New Web-Design Concept (HTML 5,CSS 3)

Looking for something else?

Subscribe to our feeds via email.