Порыскав по "всемирной" не нашёл ровным счётом ничего, может искал не так или не там. Поэтому решил сделать самостоятельно.
Оказалось всё не так сложно, надеюсь начинающим блогерам или верстальщикам пригодится.
Если всё делать правильно должно получиться примерно так:
HTML:
Заранее прошу простит меня за оформление кода, но по своей глупости не могу понять как его вставить чтобы редактор не вырезал, ну да ладно ...
div class="date"
div class="month" Январь /div
div class="day" 07 /div
div class="year" 2008 /div
/div
Если вам не нужно показывать какой-либо из блоков - можете смело его удалить.
CSS:
.date {
background: url ('адресс картинки') no-repeat;
height:71px; width:50px; // подгоняются под размер картинки
line-height:22px; // подгоняются под размер картинки
text-align:center;
}
.month {
font: normal 10px "Trebuchet MS";
color:#FFFFFF;
margin: 0px 0px 1px;
padding: 0px;
text-align: center;
width:50px;
}
.day {
font: normal 20px "Trebuchet MS";
color: #ссс;
margin:0px 0px 1px;
text-align:center;
width:50px;
}
.year {
color:#434B4D;
font: normal 10px "Trebuchet MS";
text-align:center;
width:50px;
}
Конечно, много чего (размеры, цвета) нужно подгонять по картинке, ну тут я думаю каждый справится.
