[html] CSS를 사용하여 라디오 버튼의 크기를 변경하는 방법은 무엇입니까?

직접적으로는 아닙니다. 사실 일반적으로 양식 요소는 CSS만으로 스타일을 지정하는 데 문제가 있거나 불가능합니다. 가장 좋은 방법은 다음과 같습니다.

1. 자바 스크립트를 사용하여 라디오 버튼을 숨 깁니다.
2. 자바 스크립트를 사용하여 원하는 방식으로 스타일을 지정할 수있는 HTML을 추가 / 표시합니다.
3. 선택한 상태에 대한 CSS 규칙을 정의합니다.이 규칙은 “selected”클래스를 yuor 범위에 추가하여 트리거됩니다.
4. 마지막으로, 라디오 버튼의 상태가 스팬 클릭에 반응하도록 자바 스크립트를 작성하고, 그 반대로 라디오 버튼의 상태 변경에 스팬이 반응하도록합니다 (사용자가 키보드를 사용하여 양식에 액세스하는 경우). 두 번째 부분은 모든 브라우저에서 작동하기가 까다로울 수 있습니다. 다음과 같은 것을 사용합니다 (jQuery도 사용합니다. 스타일을 지정하고 “선택된”클래스를 입력 레이블에 직접 적용하여 추가 범위를 추가하는 것을 피합니다).

자바 스크립트

var labels = $("ul.radioButtons).delegate("input", "keyup", function () { //keyboard use
        if (this.checked) {
            select($(this).parent());
        }
    }).find("label").bind("click", function (event) { //mouse use
        select($(this));
    });

function select(el) {
    labels.removeClass("selected");
    el.addClass("selected");
}

HTML

<ul class="radioButtons">
    <li>
        <label for="employee1">
            employee1
            <input type="radio" id="employee1" name="employee" />
        </label>
    </li>
    <li>
        <label for="employee2">
            employee1
            <input type="radio" id="employee2" name="employee" />
        </label>
    </li>
</ul>