CSS: определение стилей для входных элементов внутри div

У меня есть div, называемый "divContainer", внутри которого у меня мало элементов ввода, таких как текстовые поля, радиокнопки и т.д. Как я могу определить стиль для CSS? Я хочу упомянуть стили для элементов внутри этого purticular div.not для всей формы.

Пример: для текстовых полей мне нужна ширина 150 пикселей; Для радиокнопки мне нужна ширина 20px;

Ответы

Ответ 1

Вы можете определить правила стиля, которые применимы только к определенным элементам внутри вашего div с идентификатором divContainer следующим образом:

#divContainer input { ... }
#divContainer input[type="radio"] { ... }
#divContainer input[type="text"] { ... }
/* etc */

Ответ 2

CSS 3

divContainer input[type="text"] {
    width:150px;
}

CSS2 добавьте класс "текст" в текстовые входы, а затем в ваш css

.divContainer.text{
    width:150px;
}

Ответ 3

Когда вы говорите "called", я собираюсь предположить, что вы имеете в виду идентификатор.

Чтобы сделать это кроссбраутером, я бы не предложил использовать CSS3 [], хотя это опция. При этом каждый из ваших текстовых полей предоставляет класс типа "tb" и радиокнопку "rb".

Тогда:

#divContainer .tb { width: 150px }
#divContainer .rb { width: 20px }

Это предполагает, что вы используете одни и те же классы в другом месте, если нет, этого будет достаточно:

.tb { width: 150px }
.rb { width: 20px }

Как упоминал @David, для доступа к чему-либо внутри самого раздела:

#divContainer [element] { ... }

Где [элемент] - любой элемент HTML, который вам нужен.

Ответ 4

Как это.

.divContainer input[type="text"] {
  width:150px;
}
.divContainer input[type="radio"] {
  width:20px;
}