Здравствуй, Алина!
Меня зовут Инна, я буду знакомить тебя с миром кодов.
Несколько вопросов:
1) Почему твой выбор учителя остановился на мне?
2) Есть какие-либо предпочтения к обучению?
3) С чего начнем: хтмл или ксс?
эвердин [faiko]
Сообщений 1 страница 10 из 16
Поделиться12012-08-09 19:41:05
Поделиться22012-08-10 00:17:57
Привет, Инна! Спасибо, что взяла меня!
1) Почему твой выбор учителя остановился на мне?
Мне очень понравились твои дизайны. Они совершенны, словно каждая мелочь продуманна, сразу видно стиль и гармонию каждого из элементов дизайна и ,надеюсь, я тоже этому смогу научится.
А вот дизы,которые меня покорили
http://uploads.ru/i/g/D/M/gDMXm.jpg
http://uploads.ru/i/B/b/j/BbjXh.jpg
http://uploads.ru/i/g/l/G/glG1h.jpg
http://uploads.ru/i/J/C/j/JCjLa.jpg
Есть какие-либо предпочтения к обучению?
Особых предпочтений нет. Просто я новичок и о кодах мало знаю. Хочется этому научится и делать все, как ты.
3) С чего начнем: хтмл или ксс?
а в чем разница между ними?
Отредактировано эвердин (2012-08-10 00:18:55)
Поделиться32012-08-10 00:23:48
А вот дизы,которые меня покорили
Ну, первый два создала _Ipnosi, а я только сверстала.)
а в чем разница между ними?
хтмл - всяческие таблицы, сайдбары, слайдеры (в сочетании с яваскриптом), а так же сама структура форума, "скелет".
ксс - это, непосредственно, сами коды дизайна, как бы "одежда" форума.
Поделиться42012-08-10 12:03:12
Ну, первый два создала _Ipnosi, а я только сверстала.)
Все равно классно)
ксс - это, непосредственно, сами коды дизайна, как бы "одежда" форума.
Давай, о них сначала.
Поделиться52012-08-10 15:09:46
эвердин
Тогда для начала тебя ждет теория.
Как сделать дизайн для форума или сайта?
CSS. Свойста текста
Делаем свой дизайн [супернатурал]
Скругленные края и тень для блоков.
Любой код CSS состоит из трёх частей: селектор, параметр и аргумент.
#селектор {параметр: аргумент}
#селектор - это название элемента, который мы меняем в дизайне. Например: когда на форум в поле "Объявление" в администрировании мы что-то ставим и нажимаем "Показать объявление", на главной странице под юзер-ссылками появляется наш контент, а над ним слово "Объявление". Селектор этого самого слова выглядит так: #pun-announcement h2. Селектор всего блока объявления выглядит так: #pun-announcement .container и так далее...
параметр: - это то, что мы собираемся менять в нашем элементе. Это может быть цвет, шрифт, фон, выравнивание, границы и так далее.
аргумент - это значение параметра. Ты знаешь, как я хреново объясняю, поэтому сразу пример: у параметра шрифта аргумент будет заключаться в названии шрифта.
Конкретный пример:#pun-announcement h2 {text-align: center;
text-transform: uppercase;
font-family: Arial;
font-size: 0.9em}После каждого значения, кроме последнего, должна стоять точка с запятой, иначе код не будет работать.
text-align: center; - выравнивает заголовок "Объявление" по центру.
text-transform: uppercase; - делает все буквы заглавными.
font-family: Arial; - делает текст шрифтом Arial.
font-size: 0.9em; - делает текст уменьшенным, как 8px в форме ответа.
Можно придавать одни и те же параметры для нескольких элементов. Для этого достаточно записать селекторы через запятую.
И создай тестовик.
Поделиться62012-08-12 00:57:06
faiko
все прочитала и создала тест http://sweetd.rusff.me/
Поделиться72012-08-12 01:46:32
эвердин
Хорошо, молодец. Давай попробуем применить наши знания на практике.
Как ты знаешь (или узнаешь), ксс без хтмл не может. Стиль всегда подключается к хтмл-шным составным частям форума. Все эти части имеют свои названия (селекторы), располагаются в окнах стиля форума и уже имеют определенные настройки, т.е. выискивать определенные селекторы нам не понадобится: все они уже у нас есть. Но о стиле форума говорить пока рановато. Сейчас я хочу попросить тебя подключить css-оформление к div-блоку.
Итак, смотри. Вот это - хтмл-код блока:
<div id="everdin">Произвольный контент. Здесь должно быть много текста, чтобы появилась прокрутка.</div>
Где everdin - собственный селектор блока.
Имея селектор, можно задать стиль, т.е. код стиля блока будет выглядеть так:
#everdin {
parameter: argument;
parameter: argument;
parameter: argument;
}
Где parameter: argument; - это параметр и аргумент, например: background-color: green;.
Сделай оформление блока по эскизу:
А код блока пока ставь в объявление. Если хочешь, то в будущем, когда будем разбираться с дизайнами, можем заняться позиционированием блоков в шапке.
Поделиться82012-08-12 12:41:08
Я сделала, но прокрутки нет
http://sweetd.rusff.me/
Поделиться92012-08-12 12:43:50
эвердин
Блок должен быть точно таким же, как на эскизе.
Поделиться102012-08-12 16:29:34
faiko
А как его сделать? Я вроде и читала, но не врубилась.