jQuery Mobile 및 CSS3을 사용하여 버튼에 둥근 모서리를 배치하려고합니다.
-
02-01-2020 - |
문제
CSS3은
입니다#hearitagain
{
border-radius: 50% !important;
}
.
HTML5는
입니다<div data-role="page" data-theme="a">
<p id="question"> The Terminator </p>
<label for="basic"> </label>
<input type="text" name="name" id="basic" value="">
<div class="ui-grid-a">
<div class="ui-block-a"> <input type="submit" class = "button" id ="checkanswer" value="Confirm"> </div>
<div class="ui-block-b"> <input type="submit" class = "button" id ="hearitagain" value="Hear It Again"> </div>
</div>
</div>
.
그러나 나는 라운드 모서리를 보지 못했습니다 .... 나는 지난 몇 분 동안 노력하고 있었지만 라운드 모서리를 보지 못했습니다.
해결책
jQuery Mobile은 실제로 버튼 클래스의 사용하여 DIV 내부의 입력을 래핑합니다. 데이터 -래퍼 - 클래스 .
둥근 모서리의 클래스를 만듭니다.
.rounded
{
border-radius: 50% !important;
}
.
은 데이터 속성에 할당합니다.
<input type="submit" class = "button" id ="hearitagain" value="Hear It Again" data-wrapper-class="rounded">
.
여기에 일하는 데모
제휴하지 않습니다 StackOverflow