CSS-код:

img {
	border: 2px solid #595959;
	padding: 4px;
}

Также можно добавить эффект смены цвета рамки при наведении курсора на изображение, если картинка является ссылкой.

CSS-код:

a:hover img {
	border: 2px solid #000;
	padding: 4px;
}

Готово!
Пример использования здесь.

p.s. В этом примере показана работа с рамками, но не ограничивайтесь только этим кодом, экспериментируйте, можно добавить еще много эффектов которые украсят изображения на Вашем сайте. Только не переусердствуйте!
p.p.s В IE6 hover таким способом не работает.

HTML-код:

<link rel="icon" href="http://ваш-сайт.ru/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="http://ваш-сайт.ru/favicon.ico" type="image/x-icon">

Пример использования можно увидеть на этом сайте в адресной строке.

В Internet Explorer favicon может не отображаться, для отображения нужно добавить сайт в избранное.

JavaScript:

function paintTable(obj){
for(i=0; i<obj.rows.length; i++){
    if(i%2>0){
       obj.rows[i].style.background = "#ccc";
    }
}
}
paintTable(document.getElementById("coloring"));

В строке

obj.rows[i].style.background = "#ccc";

задается цвет бэкграунда ячеек.

В строке

paintTable(document.getElementById("coloring"));

задается id таблицы, в данном случае это “coloring”.

Теперь для того, чтобы ячейки у заданной таблицы раскрашивались в нужный нам цвет, нужно присвоить таблице id который указан в скрипте, например так:

HTML-код:

<table id="coloring"> ...

Пример, того что получится, можно посмотреть здесь.

Работоспособность:
Internet Explorer 8
Firefox 3.5.4
Opera 9.64

CSS-код:

.headline {
border: 1px solid #000000; 
cursor: pointer; 
text-align: center;
}
.hidden {
display: none; 
border: 1px solid #ff0000; 
text-align: center; 
margin-top: 2px;
}

JavaScript:

function show(ele) {
      var srcElement = document.getElementById(ele);
      if(srcElement) {
          if(srcElement.style.display == "block") {
            srcElement.style.display= 'none';
          }
          else {
            srcElement.style.display='block';
          }
      }
  }

HTML-код:

<div class="headline" onclick="show('cat1')">Заголовок</div>
<div class="hidden" id="cat1">Текст раскрывающегося блока</div>

Пример, того что получится, можно посмотреть здесь.

Работоспособность:
Internet Explorer 8
Firefox 3.5.4
Opera 9.64

CSS-код:

.r1, .r2, .r3, .r4, .r5, .r6, .r7, .r8, .r9, .r10 {
display: block;
height: 1px;
overflow: hidden;
font-size:1px;
}
.r1 {margin: 0 1px;}
.r2 {margin: 0 2px;}
.r3 {margin: 0 3px;}
.r4 {margin: 0 4px;}
.r5 {margin: 0 5px;}
.r6 {margin: 0 6px;}
.r7 {margin: 0 7px;}
.r8 {margin: 0 8px;}
.r9 {margin: 0 9px;}
.r10 {margin: 0 10px;}
.content, b {background-color: #CCCCCC;}
.content {padding: 10px 10px; text-align: center;}

HTML-код:

<b class="r10"></b><b class="r7"></b><b class="r5"></b><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r2"></b><b class="r1"></b><b class="r1"></b><b class="r1"></b>
<div class="content">
Здесь содержимое блока
</div>
<b class="r1"></b><b class="r1"></b><b class="r1"></b><b class="r2"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b><b class="r5"></b><b class="r7"></b><b class="r10"></b>

В данном примере показаны углы с закругленностью в 10px. Но не стоит на этом останавливаться, нужно экспериментировать и изобретать новые дизайнерские решения.

Пример, того что получится, можно посмотреть здесь.

Работоспособность:
Internet Explorer 8
Firefox 3.5.4
Opera 9.64

CSS код:

#block-on-center {
position: absolute;
top: 50%;
left: 50%;
height: 200px;
width: 200px;
margin-top: -100px; /* значение равно половине height со знаком минус */
margin-left: -100px; /* значение равно половине width со знаком минус */
border: 1px solid #000;
}

HTML-код:

<div id="block-on-center">
<!-- здесь содержимое блока -->
</div>

Размещаем вышеприведенный код в своем HTML документе не забывая про doctype, head, body, и другие элементы. Готово!

Пример, того что получится, можно посмотреть здесь.

Работоспособность:
Internet Explorer 8
Firefox 3.5.4
Opera 9.64

CSS код:

.alignleft {
float: left;
}
.alignright {
float: right;
}

HTML код:

<div id="textbox">
<p class="alignleft">Текст слева</p>
<p class="alignright">Текст справа</p>
<div style="clear: both;"></div>
</div>

Пример, того что получится, можно посмотреть здесь.

Работоспособность:
Internet Explorer 8
Firefox 3.5.4
Opera 9.64