^

Сайт и форум / Оформление страниц. CSS

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
# 24 июня 2010, 16:13     автор темы

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Расскажите побольше про возможности редактирования страниц :)
Ну или хотя бы ответьте на вопросы:

>>>Новый логотип
1. Где взять стандартную надпись SQUARE FACTION без фона, что бы наложить на новую картинку?
2. Когда я сделаю новую картинку, то как мне её загрузить и потом найти? ))
3. Далее, я думаю, в блоке для CSS нудно прописать чего-нить типа:
#logo-block h1 { background-image: url(/images/design/mynewlogo.jpg);}
Вопрос, что конкретно и каков будет адрес загруженной картинки?

>>>Другие блоки
1. В нашем могучем хелпе по CSS есть пример смены цвета нижнего блока. Вопрос: какие еще доступны блоки?
2. Точнее так: такие настройки можно проворачивать только с заранее разрешенными блоками типа нижнего, или со всеми имеющимися и нужно знать только как они называются?
3. Что еще можно делать с блоками. можно-ли поменять цвет шрифта, сам шрифт и т.д.?

>>>Остальные кнопочки
Можно-ли изменить цвет кнопок в верхнем меню «люди, игры, кланы…», остальные кнопки типа удаления из любимых?

>>>Что почитать про CSS?

ЗЫ: не знал где создать тему. Перенесите если что.
Отредактировано 25 июня 2010, 16:16
...
# 6 июля 2010, 08:49

CJ Slade

Основатель 32 уровень
682 сообщения
2460 SFP
Меню
//само меню
#main-menu {
background: none;
}
//убираем разделители
#main-menu li {
background: none;
}
//пункт меню
#main-menu li a {
color: #000;
text-shadow: none;
}
//пункт меню при наведении
#main-menu li a:hover {
background: none;
color: #CE5839;
}

Ссылки в анкете
#custom-page div.data-block td a {
color: #fff;
}
#custom-page div.data-block td a:hover {
color: #eee;
}
+19
# 6 июля 2010, 09:34

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
Было бы круто, если бы кто-то собрал это все воедино и добавил в подсказку, которую можно вызвать при оформлении CSS. А то пользователь 12 уровня должен знать побольше, чем положение логотипа и цвета нижнего блога с копирайтами)

Не перечитывать же ему тему.
+17
# 6 июля 2010, 10:07

CJ Slade

Основатель 32 уровень
682 сообщения
2460 SFP
Прояви инициативу
+21
# 6 июля 2010, 13:57

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Я пока ковыряюсь @dameon писал:
Было бы круто, если бы кто-то собрал это все воедино и добавил в подсказку, которую можно вызвать при оформлении CSS. А то пользователь 12 уровня должен знать побольше, чем положение логотипа и цвета нижнего блога с копирайтами)

Не перечитывать же ему тему.
Хорошее дело :)
Я бы тоже проявил, но сам еще не особо разобрался. Кстати, такие штуки можно было бы оформлять в виде статей. Я уже вижу заголовки типа «CSS для чайников», «СSS советы и прохождение», «Оформление страниц, первый опыт», «Оформление страниц, записки трудоголика» :). Даешь общий раздел сайта со статьями! )))
# 6 июля 2010, 14:06

CJ Slade

Основатель 32 уровень
682 сообщения
2460 SFP
@Cypher писал:
Я пока ковыряюсь @dameon писал:
Было бы круто, если бы кто-то собрал это все воедино и добавил в подсказку, которую можно вызвать при оформлении CSS. А то пользователь 12 уровня должен знать побольше, чем положение логотипа и цвета нижнего блога с копирайтами)

Не перечитывать же ему тему.
Хорошее дело :)
Я бы тоже проявил, но сам еще не особо разобрался. Кстати, такие штуки можно было бы оформлять в виде статей. Я уже вижу заголовки типа «CSS для чайников», «СSS советы и прохождение», «Оформление страниц, первый опыт», «Оформление страниц, записки трудоголика» :). Даешь общий раздел сайта со статьями! )))
Могу полезные статьи сюда http://squarefaction.ru/page/help в правую колонку добавить
# 6 июля 2010, 14:17

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
@CJ Slade писал:
@Cypher писал:
Я пока ковыряюсь @dameon писал:
Было бы круто, если бы кто-то собрал это все воедино и добавил в подсказку, которую можно вызвать при оформлении CSS. А то пользователь 12 уровня должен знать побольше, чем положение логотипа и цвета нижнего блога с копирайтами)

Не перечитывать же ему тему.
Хорошее дело :)
Я бы тоже проявил, но сам еще не особо разобрался. Кстати, такие штуки можно было бы оформлять в виде статей. Я уже вижу заголовки типа «CSS для чайников», «СSS советы и прохождение», «Оформление страниц, первый опыт», «Оформление страниц, записки трудоголика» :). Даешь общий раздел сайта со статьями! )))
Могу полезные статьи сюда http://squarefaction.ru/page/help в правую колонку добавить
Ага. Я как-то поднимал тему об общем разделе статей ибо написать и попросить чтобы кто-нибудь написал хочу не только о хелпе по сайту :).
http://squarefaction.ru/forums/show/3/4750?page=6
третье сообщение
# 6 июля 2010, 15:01

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
Гайдов по CSS дофига, но достаточно указать здесь, как обращаться к основным элементам оформления именно нашего сайта и все.

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

+8
# 6 июля 2010, 17:11

Darkness

Гражданский 31 уровень
5718 сообщений
1848 SFP
Как изменить цвет панели названия игры?

И в нижнем блоке цвет этого: Написать администрации Помощь Правила Контакты «Pixel» CJ Slade ?

И цвет ссылок меню самой игры. Обои, статьи и т.д.

Какой точный цвет серого у анкеты? (вроде бы подобрал 646464, оно?)

Как перекрасить разделители в анкете?
Отредактировано 6 июля 2010, 18:16
# 6 июля 2010, 17:30

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Очень нужно расширить атрибуты тега БР! )))
<br clear=«all | left | right | none»>

Пример: делаю обтекаемую картинку. Но обтекаемого текста мало, приходиться добивать
бр`ами. Дык вот в разных браузерах нужно разное количество бр`ов. Я думаю, что если сделать
<br clear=«left»> проблема решится :).


# 6 июля 2010, 17:38

Darkness

Гражданский 31 уровень
5718 сообщений
1848 SFP
#layout-footer div.container{

background: #fff;

}

Не работает(
# 6 июля 2010, 17:49

Derfas13

The Archivist 45 уровень
3276 сообщений
5279 SFP
@Darkness писал:
(1) Как изменить цвет панели названия игры?

(3) И в нижнем блоке цвет этого: Написать администрации Помощь Правила Контакты «Pixel» CJ Slade ?

(2) И цвет ссылок меню самой игры. Обои, статьи и т.д.
(1)

.head-bar {
   background: #720108;
}

(2)

body a {
   color: #720108;
}
body a:hover {
   color: #c01b17;
}

(3)

#layout-footer div.container {
   background: none;
   color: #ff300d;
}
#layout-footer div.container a {
   color: #c01b17;
}
#layout-footer div.container a:hover {
   color: #bbb5b9;
}
+9
# 6 июля 2010, 17:52

Derfas13

The Archivist 45 уровень
3276 сообщений
5279 SFP
@dameon писал:
Запорол страницу — что делать?

Ну ты даёшь О_о

# 6 июля 2010, 18:00

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
Блин, Дерфас, IE помог! А редактор CSS вообще отключился, а на странице ужас был.
# 6 июля 2010, 18:48

Darkness

Гражданский 31 уровень
5718 сообщений
1848 SFP
А можно центрировать название игры? Когда оно короткое, смотрелось бы явно лучше.
# 6 июля 2010, 18:51

Derfas13

The Archivist 45 уровень
3276 сообщений
5279 SFP
@Darkness писал:
А можно центрировать название игры? Когда оно короткое, смотрелось бы явно лучше.

Попробуй «text-align: center;» там.

+9
# 6 июля 2010, 19:07

Darkness

Гражданский 31 уровень
5718 сообщений
1848 SFP
Derfas13
Вах, супер. И это работает. Пасиба за всё))

А фон анкеты как..? ^_^
# 6 июля 2010, 19:10

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
#page-info { background-color: white;
        background-image: url('/images/sun.gif');
        background-repeat: no-repeat;
        background-position: top center;
}


Что надо\не надо — исключить или поменять.


Все фоны, цвета, шрифты — команды одни и те же. Главное id элемента знать.

Отредактировано 6 июля 2010, 19:28
+9
# 9 июля 2010, 02:55

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Какой по умолчанию шрифт в статьях и какого размера, 11, 12? ))
# 9 июля 2010, 03:16

Darkness

Гражданский 31 уровень
5718 сообщений
1848 SFP
Сайф, иди лучше спать :)
# 9 июля 2010, 08:59

CJ Slade

Основатель 32 уровень
682 сообщения
2460 SFP
@Cypher писал:
Какой по умолчанию шрифт в статьях и какого размера, 11, 12? ))

12px
# 9 июля 2010, 15:04

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Спс))

Вопрос 1:
Я вот простой вещи не понимаю, в хелпе написанно, что разрешен тег div[class]. Соответственно в тексте описания игры или в статье пишу:

…Начало текста…<div class="cypherclass">…Текст который должен быть изменен…</div>конец текста….

В редакторе css пишу (параметры от балды для теста):
div.cypherclass{
color : green ;
background : yellow;
font-family : «Lucida Console»;
font-size: 16px;
}

Соответственно ничего не происходит
UPD: <div class="cypherclass"></div> просто превращаются в <p></p>

Вопрос 2: чем отличается
<div id=«тратата»> от <div class=«траттата2»> ?
ну или другими словами как объяснить такую конструкцию:
<div class=« editable» id=«entry»>

UPD: может которые id это каки-ето сайтовые блоки, области, а клакссы дляэлементов этих блоков?
Соответственно в цсс те, что id начинаются с #, остальные с точки?


Вопрос 3:
Как я понял, чтобы выловить болоки которые собираемся изменять смотрим исходный
код сраницы. например в описании игры я выловил <div class="description">.
Соответственно в цсс работает:
div.description{
color : green ;
background : yellow;
font-family : «Lucida Console»;
font-size: 16px;
}

Как сделать тоже самое для статей?
там есть <div class="span-37 last"> — это для заголовка статьи? Но почему тогда далее нет </div>
Далее
<div class=" editable" id="entry">
<div class="text no-img-borders content">
что здесь editable, entry и text no-border… за что отвечают? )

Методом тыка установил что в CSS раотает конструкция
div.editable{
color : green ;
background : yellow;
font-family : «Lucida Console»;
font-size: 16px;
}
Но это применяется к содержимому всех статей сразу. Так и должно быть?
Отредактировано 9 июля 2010, 15:24
# 9 июля 2010, 15:25

CJ Slade

Основатель 32 уровень
682 сообщения
2460 SFP

Тег DIV конвертировался в P. Поэтому лучше сразу писать:

<p class="my-class">text</p>

class — может содержать несколько элементов

id — только один класс для заголовков в списке статей  

.title {}

заголовок на странице статьи

h2 {}

P.S.: FireFox + FireBug (кнопка изучаения элемента) решит все ваши проблемы.

Отредактировано 9 июля 2010, 15:36
+8
# 9 июля 2010, 15:30

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
CJ Slade, помойму часть сообщения проглотилась.
# 9 июля 2010, 15:31

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
В Google Chrome тоже есть «Показать код элемента».
+8
# 9 июля 2010, 16:07

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
А можно, чтобы окно редактора игры пристыковывался где-нибудь снизу экрана?
А то иногда приходится подгонять логотип. А то и так нужно за панелью пользователя следить, да еще это окно там висит.
# 10 июля 2010, 14:54

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Подчеркнутый текст нельзя сделать каким-нибудь простеньким тэгом типа <u></u>?
# 10 июля 2010, 14:57

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
В статьях? Видимо нет, остальные теги Слейд не разрешил)
# 11 июля 2010, 14:38

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
Не получается убрать таблицу под спойлер...
+10
# 11 июля 2010, 14:47

dameon

Devil Summoner 75 уровень
8595 сообщений
19931 SFP
Скорее всего, не рассчитано на это, так как таблицы были добавлены позже. А вот по спойлерам есть предложения.

Например, сделать спойлер открываемым и закрываемым, как есть на всех остальных сайтах.

И добавить возможность менять текст заголовка «Спойлер». А то таблица скрытая под знаком «Спойлер» будет выглядеть странно. А было бы красивее наверно, если «Просмотреть», «Показать таблицу», «Ознакомиться».



+8
# 11 июля 2010, 14:56

Cypher

Гражданский 24 уровень
2169 сообщений
1748 SFP
У меня таблицей просто текст на две колонки разбит. Хочу засунуть их под спойлер :)

На счет закрывающегося спойлера это первое о чем я подеумал когда попробовал. Голомую за закрывающийся спойлер!

Текст заголовка можно менять, но сама система установки спойлеров злая какая-то. Где-нибу вообще было рассказанно как спойлерами пользоваться? Я разобрался методом тыка вот до такого уровня)):

<span class="spoiler">                 //Начинается спойлер
        <span class="spoiler-title">          //начинается заголовок спойлера
                <span>                                            // тут идет текст заголовка спойлера. Можно
                                                                        //  опустить последние <span></span>
                        Читать спойлер                       // Но без них «читать спойлер» смотрится отстойно
                                                                        //  курсор превращается в выделялку текста
                </span>                                           // цвет черный.                  
        </span>                                        //заканчивается заголовок спойлера


        <span class="spoiler-text">         //начинается скрываемый текст

                 Этот герой нетрадиционной сексуальной ориентации,
                 но об этом мы узнаем в самом конце игры

        </span>                                        //заканчивается скрываемый текст

</span>                                       //заканчивается спойлер

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

Для комментирования необходимо авторизоваться