Essayer de placer les angles arrondis sur des boutons à l'aide de JQuery Mobile et CSS3
-
02-01-2020 - |
Question
CSS3 est
#hearitagain
{
border-radius: 50% !important;
}
html5 est
<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>
Mais je ne vois pas les coins rounds .... J'ai essayé depuis plusieurs minutes, mais je ne vois pas les coins ronds.
La solution
JQuery Mobile enveloppe en réalité les entrées à l'intérieur d'une div avec les classes de boutons.Vous pouvez facilement ajouter une classe à l'enveloppe à l'aide d'un attribut de données sur l'entrée appelée
Créez donc une classe pour les coins arrondis:
.rounded
{
border-radius: 50% !important;
}
Attribuez ensuite à l'attribut Data:
<input type="submit" class = "button" id ="hearitagain" value="Hear It Again" data-wrapper-class="rounded">
Voici un démo
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow