Самый лёгкий

[альпачина]

_scrsh easy by ~cherrygir1 on deviantART
_scrsh for IE by ~cherrygir1 on deviantART

код

body {margin:0; padding:0;overflow-x: hidden; } #wrapper {width:470px; position:absolute; left:50%; margin-left:-310px;} #side {width: 110px !important; position:fixed !important; top:14px !important; margin-left: 20px;} #page-c {position:relative !important; width: 700px; margin-right: 370px !important; margin-top:0px !important; margin-left:0px !important; left: 0px !important; top:14px !important; } #side h1 {width:100px; margin-left: 0px} .menuSection {text-align:center} #myDraftLink, #photolibLink, #favListLink, #pchListLink, #communityCatalogueLink, #myCommunitiesLink, #diarySpiritLink, #diarySupportLink, #faqLink, #iAmQuit, #Stats, #upInChart, #myProfileLink, #topNav, #YaSearch, #sortFromBegin, #sortFromEnd, #sortFromLastComment, #sortOrder, .order_button, #register, .lostpassword, #login_form, #writeToAuthor {display:none} body {background-image: url("/userdir/2/7/2/6/2726347/71271986.jpg") !important; background-position: center; } body{ background-attachment:fixed !important; } body, a:hover {cursor: crosshair } #side, .postLinksBackg, .postDate, .postLinks, .singleComment, .pageBar { text-transform: lowercase; } BODY, HTML { SCROLLBAR-FACE-COLOR: #000000; SCROLLBAR-HIGHLIGHT-COLOR: #a6a6a6; SCROLLBAR-SHADOW-COLOR: #4d4d4d; SCROLLBAR-3DLIGHT-COLOR: #a6a6a6; SCROLLBAR-ARROW-COLOR: #4d4d4d; SCROLLBAR-TRACK-COLOR: #4d4d4d; SCROLLBAR-DARKSHADOW-COLOR:#4d4d4d; } .paragraph div:first-letter { font-size: 30px; float: left !important; float: none; font-family:Times New Roman; margin-right: 3px; color: #000000; line-height:100% !important; } #page-c, #side {-moz-opacity:.10 !important;opacity:.50 !important; filter:alpha(opacity=50); } .atMusic SPAN {display:block; width:50px; height:20px; line-height:400px; float:left; overflow:hidden; background: #000000 url('/userdir/2/7/2/6/2726347/71366134.gif') 5px 4px no-repeat;} a:hover{color:#200f6a} A:hover {font-style: italic; text-decoration:none;} .postInner a {text-decoration:none;} #register, .lostpassword, #login_form, #writeToAuthor {display: none;} #side {filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);} #bottomNav, #Stats, #topNav {display: none !important; } .left #page-c{filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);}

Дизайн протестирован в IE, MF, Opera, Chrome.

подробнее о дизайне

Табличный дизайн. Навиг.панель слева.

Шрифт
-заголовка: жирный-курсив 17
-текста: жирный 12
-гарнитура Georgia


Цвет текста
-заголовка #8c298e
-записи #0f1004
-ссылки #050405
-оффтопика #ffffff

Цвет фона и границ
-фона дневника #ffffff
-фона заголовка #908895
-фона записи #908895
-границы #200f6a

изображения:

фон

_background by ~cherrygir1 on deviantART

@music

_music by ~cherrygir1 on deviantART

примечание от меня

все приложенные изображения с девиантарта - лучше загружать и смотреть в нормальном размере у себя на ПК. это мой первый дизайн в css. Просьба не судить строго. Прекрасно знаю, что много ошибок, недочётов и всего прочего, что плохо смотрится на больших экранах и вообще кривой... Буду рада всем комментариям и доработкам. Надеюсь на лучшее %D

Отдельно

Отдельно хочется сказать спасибо тем, кто вносил свои доработки, помогал ещё на стадии создания дизайна. Огромное спасибо! Вы навсегда в моём сердце)))))))))))

@темы: Дизайн с использованием CSS

Comments

[~Omi~]

А мне очень нравиться **

[vitual.]

очень красивый)
жаль у меня не цсс

[~Omi~]

Только вопрос один - как сделать так, чтобы изображение не были такими полупрозрачными?

[альпачина]

~Omi~, вот этого не знаю, но знаю точно, что можно так сделать.
В идеале такая прозрачность, как сейчас, всех элементов была задумана.

[Black&hole]

Прелесть
Можно я это к себе утащу? И добавлю один элемент
А прозрачность регулируется вот тут:
#page-c, #side {-moz-opacity:.10 !important;opacity:.50 !important; filter:alpha(opacity=50); }

[Raven18]

Крутая тема))
Можно как-то себе взять?)

[KZavi]

Приспособила под бесплатный дневник, хорошо смотрится)
Единственное, что добавила, это эпиграф.