Стили с надписью «Radio Button»

Question

У меня есть несколько кнопок радио, как показано здесь:

<input type="radio" name="sex" id="Duration" value="Duration"/>
<label"Duration">Date Range</label>

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

Может ли кто-нибудь помочь мне?

Answer 1

Сначала вам нужно исправить код этикетки, у вас есть <label"Duration">, и он должен иметь «for», например:

<label for="Duration">

(читайте здесь: http://www.w3schools.com/tags/tag_label.asp)

Затем вам нужно нацелиться на <label> с помощью CSS.

Попробуйте это в своих определениях CSS:

label {
   text-size: 11px;
   font-weight: bold;
}

Answer 2

Внести немного в ДжекДжо немного что-то на стороне:

"Я бы порекомендовал использовать класс вместо 'id', потому что класс используется для многократного использования для одной и той же цели, например, для набора радиокнопок, которым нужен один и тот же стиль, но в большинстве случаев идентификатор используется только один раз." ;

<label class="duration"> 

в css вам нужно '.' называть это классом и символом «#» называть это идентификатором (извините за мой плохой английский)

CSS:

.duration{
width:21px;
height:21px;
margin: 0px;
padding: 0px;
background-image:url(images/radiobutton.png);
background-repeat: no-repeat;
}

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

Answer 3

Это образец стиля

.radio {
  width: 19px;
  height: 25px;
  padding: 0 5px 0 0;
  background: url(checkbox.gif) no-repeat;
  display: block;
  clear: left;
  float: left;
}