1. Главная
  2. Форумы
  3. Техподдержка Drupal
  4. FAQ

Как поменять цвет полей ввода в форме?

Главные вкладки

Аватар пользователя Kvark Kvark 7 апреля 2011 в 11:43

Народ! Снова я к вам за помощью, поставил вебформс на 7 друпа, а как форму немного поменятьь под свои нужды? Мне хочеться чтобы фон был не белым изначально а скажем золотистым - подскажите как обратиться к свойствам веб формы чтоб это поменять?

Комментарии

Аватар пользователя Kvark Kvark 7 апреля 2011 в 17:51

пипец Smile сорри не удержался - почему когда конкретно спрашиваеш, никто не может конкретно ответить?
Я ж не спрашивал где почитать про css? Не спрашивал и чем смотреть состав страницы Smile

Не, я понимаю что тут никто мне ничего не должен, но зачем давать ссылку на весь учебник когда мне нужно только конкретное значение, тоесть простой пример - ну что это можно я и сам понимаю, но вот конкретно может кто показать? Ну лень вам или незнаете - зачем писать общими фразами? Smile Конкретики пожалуйста! Я понмаю что я новичок и мои вопросы очень зеленые, но как быстро научитсья если все отсылают к мануалам вместо простенького примера Sad

Аватар пользователя xxandeadxx xxandeadxx 7 апреля 2011 в 18:14

самый быстрый способ чему то научиться - прочитать мануалы. если все к ним отсылают это не значит что все мудаки один вы дартаньян, на самом деле всё наоборот

Аватар пользователя Kvark Kvark 7 апреля 2011 в 22:10

безполезно спорить, ответа так никто и не дал... наверно никто не знает... все усиленно читают мануалы...

Аватар пользователя q2_faith q2_faith 7 апреля 2011 в 22:58

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

Аватар пользователя Kvark Kvark 7 апреля 2011 в 23:12

дык яж не против учиться, я может просто не понимаю и не умею сформулировать свой вопрос, ну давайте с вами попробую Smile
вот что имеею:
(http://www.chanceinternational.co.uk/en/Contact)

<div class="form-item webform-component webform-component-textfield" id="webform-component-name">
 <span class="field-prefix">Name:</span> <input type="text" id="edit-submitted-name" name="submitted[name]" value="" size="60" maxlength="128" class="form-text required">
</div>

я понимаю что в сss нужно что то типа:

.field-prefix
{
   color: white;
}

но чтот не работает, почему и спрашивать стал как его изменить, не каким способом а КАК, тоесть что то типа в такомто файле вебформа вставить сласс mycollor чтобы на форму он выводился уже как

<div class="form-item webform-component webform-component-textfield" id="webform-component-name">
 <span class="field-prefix"><div class="mycollor">Name:</div></span> <input type="text" id="edit-submitted-name" name="submitted[name]" value="" size="60" maxlength="128" class="form-text required" class="mycollor">
</div>

как то так... а вот где это прописать я немогу найти Sad

Аватар пользователя alexxrin alexxrin 7 апреля 2011 в 23:30

Для вашей верстки так и напрашивается в html-reset.css, в 26 строке добавить color, чтобы было:

body {
  font-size: 100%; /* Fixes exaggerated text resizing in IE6 and IE7 */
  color:white;
}

Это установит для всего текста по умолчанию белый цвет. И в частности для лейблов тоже.
Почему у вас не работал вариант с:

.field-prefix
{
   color: white;
}

Не совсем понятно, может быть не сбросили кэш?

Аватар пользователя Kvark Kvark 8 апреля 2011 в 0:26

Кажеться разобрался, за содержимое тексфилдов зацепился через:
.form-text

пытаюсь понять как цвет рамки внутри поля поменять - что за свойство может кто подскажет?
За одно кнопку покрасил, но закругление пропало Sad

Аватар пользователя Kvark Kvark 8 апреля 2011 в 2:12

продолжая изголяться над формой - столкнулся с тем что нужно один лейбл сдвинуть ниже чем его собраться - как к нему можно подцепиться? Все собратья руляться (кажеться) нижним куском css

(http://www.chanceinternational.co.uk/en/Contact -> Message)

.webform-client-form label
{
        float: left;
        display: block;
        font-family: Verdana, Arial, Helvetica, Tahoma, sans-serif;
        font-size: 10pt;
        text-align:right;
        width:160px;
        height: 18px;
        margin: 3px 0px 8px 0px;
}
Аватар пользователя alexxrin alexxrin 8 апреля 2011 в 5:35

Поставьте в браузер отладчик http://getfirebug.com/ и жизнь ваша станет легче.

Каждый элемент формы (кроме кнопок) в друпале по умолчанию имеет содержится в div с классом form-item. У каждого контейнера есть также уникальный id через.
Следовательно каждый лэйбл находится в этом же контейнере.

Для вашей формы к конкретному лэйблу можно обратиться через следующие селекторы:

#webform-component-name label
#webform-component-e-mail label
#webform-component-contact-number label
#webform-component-best-time-to-contact label
#webform-component-message label
#webform-component-where-did-you-hear-about-us label

Аватар пользователя Kvark Kvark 8 апреля 2011 в 10:55

"Stasun" wrote:
http://www.chanceinternational.co.uk/websites/123reg/LinuxPackage21/ch/a...
Для меня это тоже странно, но это со стороны хостера вылазит - может кто знает как это привести к нормальному виду или спрятать хотя бы?

Аватар пользователя Kvark Kvark 8 апреля 2011 в 10:57

"alexxrin" wrote:
Для вашей формы к конкретному лэйблу можно обратиться через следующие селекторы:

Спасибо! То что надо!

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

Аватар пользователя Kvark Kvark 8 апреля 2011 в 11:17

Последний вопросики по фебформе - текстареа в ИЕ фиксирована а в хроме можно растягивать, подскажите как можно это запретить? А для ИЕ покрасить полоску прокрутки которая хорошо бы чтоб появлялась только когда много текста а не сразу?

Аватар пользователя alexxrin alexxrin 8 апреля 2011 в 14:13
textarea {
  resize:none;
}

Помогает для web-kit'ов и firefox4, остальные пока растягивать не порываются.

По ИЕ посмотрите тут: http://www.xiper.net/collect/html-and-css-tricks/verstka-form/taxtarea-resize.html, я на память сейчас все равно не вспомню.