очкарик vs euphi [дизайн]

Поделиться12011-01-07 13:12:46

Автор: euphi;
Участник
Зарегистрирован: 2011-01-04
Приглашений: 0
Сообщений: 28
Уважение: +2
Позитив: +0
Провел на форуме:
6 часов 17 минут
Последний визит:
2011-01-21 08:17:04

Ну, пожалуй начнем. Меня зовут Юля. Ко мне можно сразу на ты, а то из-за выкалок у меня создается впечатление, что я старая карга. Сразу могу предупредить - ты, мой самый-самый первый ученик, так что я кое-какие ляпы так же могу допустить. Разбираем мы с тобой css в цветах. так как структурой занимаются люди, посвятившие себя целиком и полностью web-дизайнам.

0

Поделиться22011-01-07 13:28:57

Автор: очкарик.
все будет coca-cola~
Откуда: у тебя такие тапки :с
Зарегистрирован: 2011-01-06
Приглашений: 0
Сообщений: 45
Уважение: +0
Позитив: +1
Пол: Женский
Провел на форуме:
7 часов 20 минут
Последний визит:
2011-04-05 15:57:21

Рада знакомству, я Алина.)
Совершенно ничего не смыслю в css, поэтому ты первая кто меня учит. И я могу по полному тупить и ничего не понимать. Я очень хочу, научиться устанавливать дизайны, хоть, как-то =)
Тебя загружать сильно не буду,)
Вернусь, вечером. пока)

0

Поделиться32011-01-07 13:29:13

Автор: euphi;
Участник
Зарегистрирован: 2011-01-04
Приглашений: 0
Сообщений: 28
Уважение: +2
Позитив: +0
Провел на форуме:
6 часов 17 минут
Последний визит:
2011-01-21 08:17:04

урок #1
Вот такая вот структура ~~как и обещала я показать. Самый первый вариант. на котором я все учила~~

Я тебе попробую её немного расшифровать, что бы ты была в курсе дела ^-^
Итак...
@import url(style_cs.css); - если ты скачиваешь где-то структуру (например на том же сайте, что я тебе дала, то проверь, есть ли вообще вот эта вот надпись. Если её нет - не отчаиваться. просто заменяем в /* A1.1 */ похожую, на вот эту вот.
{margin: 0; padding: 0} - это отступы. Я советую их вообще не трогать, так как это может сдвинуть дизайн в какую-то совершенно непонятную сторону. Запомни. где есть эти два слова - там можно менять отступ (например вправо или влево...)

/* A3 Text setup
-------------------------------------------------------------*/ - из самого названия ясно, что тут можно изменить вид текста.

/* A3.1 */
body {
font-size: 100.01%;

- это вот, размер текста. Ты можешь задавать его как в пикселях. так и в процентах, но я сама предпочитаю проценты, так как это немного проще.

/* A3.2 */
.punbb {
font: normal 68.75% verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}

/* 3.3 */
.punbb textarea, .punbb input, .punbb select, .punbb optgroup {
font: 1em verdana, arial, helvetica, sans-serif
}

Вот где ты видишь названия шрифтов, там их и меняй. на сколько я помню, в 3.2 меняется шрифт во всем форуме, а в 3.3. в форме ответа

/* A3.4 */
.punbb h1, .punbb h2, .punbb h3, .punbb th {
font-size: 1em;
font-weight: bold;
}

.punbb h4, .punbb table {
font-size: 1em;
font-weight: normal;
}

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

/* A3.5 */
.punbb h1 span, .punbb h2 span, .punbb legend span {
font-size: 1.1em;
}

изменяется размер шрифта

В принципе, в части текста все повторяется. тебе достаточно знать, что
font-size: изменяет размер шрифта
font-weight: изменяет стиль начертания. Они могут быть такими: bold. normal и italic
Лично я не трогаю все остальные части. так как они задают ширину и длину каких-то определенных частей на форуме. Я их даже не разбирала, если честно, так что не могу точно сказать где-что.
В части D каждая часть говорит сама за себя. Её можно изменять. если то захочется, но из неё я объясню тебе только ту часть, где можно изменить размеры шапки.

/* D1 Logo and description
-------------------------------------------------------------*/

/* D1.1 */
#pun-title {
margin: 0;
border-style: solid solid none solid;
border-width: 1px 1px 0 1px;
} очертания вокруг шапки. по желанию тут можно везде поставить 0

/* D1.2 */
#pun-title h1 {
display : block;
height : 350px;
width: 100%;
margin: -1px 0px -1px 0px;
}как будет выглядет шапка. Размер блока в котором она расположена (если честно, не трогаю. так что точно не скажу)

/* D1.3 */
#pun-title .container {
border-style: none solid none solid;
padding: 0.2em 1em 0.8em 1em;
}

/* D1.4 */
#pun-title h1 span {
display: none;
}

#pun-title TABLE {
border: none;
height: 350px;

}

#pun-title TD.title-logo-tdl {
border: none;
width: 100%;
}

#pun-title TD.title-logo-tdr {
border: none;
width: 468px;
}

- высота шапка, и её очертания

border - границы

Надеюсь. я в этом уроке хоть что-то тебе объяснила =-=

+2

Поделиться42011-01-07 13:32:38

Автор: euphi;
Участник
Зарегистрирован: 2011-01-04
Приглашений: 0
Сообщений: 28
Уважение: +2
Позитив: +0
Провел на форуме:
6 часов 17 минут
Последний визит:
2011-01-21 08:17:04

очкарик. написал(а):

Рада знакомству, я Алина.)
Совершенно ничего не смыслю в css, поэтому ты первая кто меня учит. И я могу по полному тупить и ничего не понимать. Я очень хочу, научиться устанавливать дизайны, хоть, как-то =)
Тебя загружать сильно не буду,)
Вернусь, вечером. пока)

Ну что же, два одиночества нашли друг-друга.
урок первый готов, так что если что не понятно - спрашивай)

0

Поделиться52011-01-09 08:35:30

Автор: очкарик.
все будет coca-cola~
Откуда: у тебя такие тапки :с
Зарегистрирован: 2011-01-06
Приглашений: 0
Сообщений: 45
Уважение: +0
Позитив: +1
Пол: Женский
Провел на форуме:
7 часов 20 минут
Последний визит:
2011-04-05 15:57:21

так ну вроде бы понятно
хотя я все еще толком не понимаю, что ты подразуумеваешь под словом структура х)
спасибо и на этом

0

Поделиться62011-01-09 08:42:47

Автор: euphi;
Участник
Зарегистрирован: 2011-01-04
Приглашений: 0
Сообщений: 28
Уважение: +2
Позитив: +0
Провел на форуме:
6 часов 17 минут
Последний визит:
2011-01-21 08:17:04

очкарик.
структура это то, что задает форуму размер иконок, ширину форума, его положение на экране и пр.
Эм... ты извини. Но я сейчас буду появляться реже х х до 11 числа вообще не появлюсь... Если хочешь - можешь учителя поменять, или меня дождаться **

0