Дизайн жж

Mar 19, 2011 09:41

Одежка "Фарфоровая фея"
Стиль S2. Ширина 1050px.



Заметила, что не очень корректно работает в IE. Сдвиг в районе шапки. Почему пока не знаю.



Общий вид (кликабельно):




Последовательность установки:

1. На странице Стиль журнала в строке поиска с правой стороны страницы ввести слово: Unstyled



2. Из трех макетов выбирать последний "Expressive" и нажать кнопку "Применить макет".



3. Внизу страницы выбрать макет журнала "Две колонки, боковая панель слева."



4. Далее переход по ссылке "Настройте свой стиль"



5. В графе "Полоса навигации" выбрать "светло-серый градиент", а затем переход по линку "Custom CSS"



6. На странице Custom CSS в поле "Custom stylesheet" вставить код и нажать "Сохранить".



код:

/*----
S2

//picture and design by http://ku-lina.livejournal.com/

------------------------------------------------*/
body{
background-color:#ffffff;
background-image:url(http://pics.livejournal.com/ku_lina/pic/0023zqch);
font-family: Verdana;
font-size:12px;}

a:link, a:visited, a font{
color:#71031d;
font-weight:normal;
text-decoration:none;
}

a:hover, a:hover b, a b{
color: #a92235;
font-weight:normal;
text-decoration:none;
}

#container{
background-color:transparent;
width:1050px;
margin:auto;
}
#container-inner{
width:1050px;
margin:0px;
padding:0px;
}
#page{
width:1050px;
margin:0px;
padding:0px;
background-color:white;
}

#page-inner{
width:1050px;
padding:0px;
margin:0px;
}

#header{
background-image:url(http://pics.livejournal.com/ku_lina/pic/0022k6db);
width:1050px;
height:460px;
background-repeat:no-repeat;
padding:0px;
margin:0px;
}
div#header-content{
width:1050px;
margin:0px;
padding:0px;}

div#header-content-inner{
width:1050px;
margin:0px;
padding:0px;
}
div#header-text{
width:1050px;
text-align:center;
}
ul.nav{
width:1050px;
position:relative;
margin-top:25px;
font-size:14px;
}
.nav a {
color: #fce6d5;
text-decoration: none;
font-variant:none;
}
.nav a:hover {
color: #ffffff;
text-decoration: none;
font-variant:none;
}
ul.nav li.item{
border:none;
float:none;
display:inline;
}
#header-name {
text-align:left;
width:1000px;
font-size:25px;
font-variant:none;
margin-top:30px;
margin-left:20px;
}
#header-name a{
color:#fffee2;
text-decoration:none;
}
#header-name a:hover{
color:#fffee2;
text-decoration:none;
}

#header-description{
width:1000px;
text-align:left;
margin-left:20px;
font-size:15px;
color:#fffee2;
}

#content {
width:1050px;
background-color:transparent;
padding:0px;
margin:0px;
}
#content-inner {
width:1050px;
padding: 0px;
margin:0px;
}
#alpha {
width:880px;
padding: 0px;
margin:0px;
}
#alpha-inner {
width: 850px;
padding: 0px;
margin: 0px;
}
#beta {
width: 170px;
float: left;
margin: 0px;
padding: 0px;
margin-top:15px;
}
#beta-inner {
width: 170px;
padding: 0px;
margin:0px;
}
#gamma {
display: none;
}
.stream-header {
position: relative;
margin-top: 10px;
margin-bottom: 15px;
}
p.prevnext, .skiplinks {
width: 850px;
margin-left:-170px;
text-align:center;
font-size: 15px;
font-variant:none;
}
p.prevnext a, .skiplinks a{
color: #7b190c;
text-decoration: none;
}
p.prevnext a:hover, .skiplinks a:hover{
color:#7b190c;
text-decoration: none;
}

.asset {
width: 850px;
margin:0px;
padding:0px;
}
.asset-inner {
width: 850px;
margin:0px;
padding:0px;
margin-bottom:25px;
}
.asset-body {
width: 850px;
padding:0px;
margin:0px;
margin-bottom:10px;
}
.asset-header {
width:850px;
padding: 0px;
font-size:15px;
}
.asset-header a{
color: #6d2728;
text-decoration:none;
font-variant:none;
}
.asset-header a:hover {
color: #7b190c;
text-decoration:none;
font-variant:none;
}

div.asset-header li.item {
float:left;
color:dark gray;
font-size:11px;
}

.asset-content {
width: 850px;
text-align: justify;
margin:0px;
padding:0px;
}

.user-icon {
float:left;
margin-right:7px;
margin-bottom: 3px;
border:none;
background-color:transparent !important;
text-align:center;
font-size:10px;
}
.user-icon span {
background-color:transparent !important;
}
.user-icon img {
padding:5px;
border:0px solid #421111;
}
img[src*="userinfo.gif"] {
padding: 0px;
}
img[src*="community.gif"] {
padding: 0px;
}

lj.currents {
width:850px;
position: relative;
margin-top: 5px;
font-size:11px;
}
.entryMetadata-label {
font-size:11px;
color:#421111;
}
.entryMetadata-content {
font-size:11px;
}
.asset-meta-list {
font-size:11px;
}
.asset-meta-list a{
color: #7b190c;
text-decoration: none;
}
.asset-meta-list a:hover {
color: #7b190c;
text-decoration: none;
}
.asset-tags {
width:850px;
margin-top:8px;
padding: 0px;
}
h4.asset-tags-header {
font-size: 10px !important;
font-weight: bolder;
margin-left:2px;
color:#421111;
}
.asset-tags-list {
font-size:10px;
}
.asset-tags-list li.item a {
color:#7b190c;
text-decoration:none;
}

.asset-tags-list li.item a:hover {
text-transform: none;
color: #7b190c;
background-color: transparent;
text-decoration:none;
}
.asset-footer {
width:850px;
height:40px;
align:center
background-repeat:no-repeat;
background-image:url(http://pics.livejournal.com/ku_lina/pic/001wxhb1);
}
.widget {
width:850px;
font-size:10px;
padding:0px;
margin:0px;
}
.widget-inner {
width:170px;
padding:0px;
margin:0px;
margin-bottom:15px;
}
h3.widget-header {
width:170px;
height:30px;
margin:0px;
padding:0px;
font-weight: bolder;
font-variant:none;
color:#421111;
font-size:10px;
text-align:center;
padding-top:25px;
background-image:none;
background-repeat:no-repeat;
background-position:top left !important;
margin-left:0px;
}

h3.widget-header a{
font-weight:bolder;
font-variant:none;
color:#421111;
text-decoration:none;
}

h3.widget-header a:hover {
font-weight:bolder;
font-variant:none;
text-decoration:none;
color:#421111;
}
.calendar-widget table {
margin-left:-8px;}

ul.year {
font-size:10px;
}
li.active {
color:#83243b;
}
#comments {
width:850px;
margin:0px;
padding:0px;
}
div .comments-inner {
width:850px;
margin-left:0px;
}

div.comments-body {
width:850px;
text-align:justify;
}

.comment-odd {
padding: 3px;
border: none;
border-bottom:#7b190c 1px solid;
}
.comment-even {
padding: 3px;
border:none;
}
.comments-header.page-header2 {
width:850px;
font-size: 20px;
color: #421111;
font-variant:none;
font-weight:normal;
margin-top:10px;
margin-left:4px;
}
div.comment-body {
margin:5px;
margin-bottom:10px;
font-size:12px;
}
hr{
display:none;}

7. Указать у себя в профиле в графе "О себе" ссылку на меня, мне будет приятно :)




http://ku-lina.livejournal.com/" _fcksavedurl="http://ku-lina.livejournal.com/" target="_blank">http://pics.livejournal.com/ku_lina/pic/0027s5zy" _fcksavedurl="http://pics.livejournal.com/ku_lina/pic/0027s5zy">

© photo&design ku_lina

© photo&design

я постаралась все очень подробно описать, если чего-то не понятно, то я готова ответить на вопросы (если смогу ;))

А так же очень рекомендую посмотреть уроки yoksel




ну а если вам не нужно, то поделитесь с друзьями, мб кому-то пригодится

код, жж, design

Previous post Next post
Up