본문 바로가기
limesurvey_라임서베이/questionnaire

[라디오 버튼 수정] 원숫자 및 다른 형식

by 거인과난쟁이 2023. 11. 28.

라임서베이에서는 라디오 버튼과 체크박스를 답변의 기본 유형으로 사용한다. 라디오 버튼의 모양을 바꿀 필요를 느낄 때가 있다. 예를 들어, 종이 형태의 시험에 익숙하거나 전화면접(ARS)에서 말로 응답하거나 전화기 번호판을 누르는데 익숙한 경우가 그렇다.

위의 첫째 문항에 대한 질문 편집 골격은 아래와 같다:

<style type="text/css">#question{QID} .radio-item label {
        padding-left: 36px;
        padding-top: 10px;;
 }
#question{QID} .radio-item label::before {
        width: 35px;
        height: 35px;
        left: 0;
        top: 1;
        border: 1px solid #ccc;
 }
#question{QID} .radio-item label::after {
        width: 24px;
        height: 21px;
        left: 5px;
        top: 9px;
}
 
#question{QID} .radio-item:nth-child(1) label::before {
        content: "1";
        padding-left: 12px;
        padding-top: 8px;
}
#question{QID} .radio-item:nth-child(2) label::before {
        content: "2";
        padding-left: 12px;
        padding-top: 8px;
}
#question{QID} .radio-item:nth-child(3) label::before {
        content: "3";
        padding-left: 12px;
        padding-top: 8px;
}
#question{QID} .radio-item:nth-child(4) label::before {
        content: "4";
        padding-left: 12px;
        padding-top: 8px;
}
#question{QID} .radio-item:nth-child(5) label::before {
        content: "5";
        padding-left: 12px;
        padding-top: 8px;
}
#question{QID} .radio-item:nth-child(6) label::before {
        content: "6";
        padding-left: 12px;
        padding-top: 8px;
}
#question{QID} .radio-item:nth-child(7) label::before {
        content: "7";
        padding-left: 12px;
        padding-top: 8px;
}
</style>

위의 코드는 라임서베이 포럼에서 추천받은 사항을 일부 수정한 것이다. ( Joffm님께 감사~)

https://forums.limesurvey.org/forum/can-i-do-this-with-limesurvey/143235-creating-a-radio-button-list-with-circled-numbers-in-a-single-choice-question

 

Creating a Radio Button List with Circled Numbers in a Single Choice Question

Creating a Radio Button List with Circled Numbers in a Single Choice Question

forums.limesurvey.org