2014-10-29 47 views
0

我有android應用程序加載webView。 在webview上我有複選框,但不能改變大小。如何更改複選框webview android

input[type="checkbox"] 
{ 
    width: 25px; 
    height: 25px; 
} 

屏幕 http://postimg.org/image/l9lg35czj/

改變大小

input[type="checkbox"] 
    { 
     width: 250px; 
     height: 250px; 
    } 

http://postimg.org/image/v96ow0otv/

爲什麼的WebView沒有改變大小,(如果我看上去與瀏覽器複選框大小此頁進行更改)?

全碼

<html> 
<head> 
<style> 
    .single_user 
    { 
     width:100%; 
     height:120px; 
     border: black; 
     background:#E5E5E5; 
     margin-bottom: 10px; 
    } 
    .user_image 
    { 
     padding-left: 10px; 
     padding-top: 10px; 
    } 
    h1 
    { 
     display: inline-block; 
    } 
    input[type="checkbox"] 
    { 
     width: 25px; 
     height: 25px; 
    } 
</style> 
<meta name="viewport" content="width=device-width, target-densitydpi=device-dpi, user-scalable=no"/> 
</head> 

<body> 
<div class="single_user"> 
<img class="user_image" src="statimg/profileicon.png"/> 
<h1> Vahagn Vard2anyan <br /> 
[email protected]</h1> 
<input type="checkbox" style="width: 100%; height:100%;"/> 
</div> 
<div class="single_user"> 
</div> 
</body> 
</html> 
+0

這是正確的看着我。 你可以在這裏發佈完整的代碼嗎? 它也取決於Android的設備和操作系統版本。 在哪個設備上破壞你的應用程序和在哪個Android操作系統? – 2014-10-29 05:53:23

回答

1

我面臨着這樣的問題太多。 html中的複選框最初不會通過寬度/高度CSS屬性更改其大小(但某些瀏覽器支持此屬性)。如果您想更改尺寸,可以使用transform: scale(scaleX, scaleY);(請參閱this answer),或者您可以實施自定義複選框,如this,但這將是絕招。

UPDATE

複選框可以很容易用文字跨度resplaced和點擊事件處理程序

<!DOCTYPE html> 
<html> 
<head lang="en"> 
    <meta charset="UTF-8"> 
    <title></title> 
    <style> 
     #checkbox { 
      width: 30px; 
      height: 30px; 
      background: red; 
     } 
     #checkmark { 
      width: 100%; 
      height: 100%; 
      font-size:30px; 
      position: absolute; 
     } 
    </style> 
    <script type="text/javascript"> 
    function setCheckboxChecked(checkbox) { 
     checkbox.checked = !checkbox.checked; 
     var checkmark = checkbox.querySelector('#checkmark'); 
     if(checkbox.checked) { 
      checkmark.innerHTML = '\u2713'; 
     } else { 
      checkmark.innerHTML = ''; 
     } 
    } 
</script> 
</head> 
<body> 
<div id="checkbox" onclick="javascript:setCheckboxChecked(this);"> 
    <span id="checkmark"></span> 
</div> 
</body> 
</html> 
+0

對不起,但不幫助這 – 2014-10-29 15:40:33

+0

在http://109.120.161.43/tmp.php網頁更改,但在webview不 – 2014-10-29 15:42:23

+0

所以,請參閱我的答案更新 – 2014-10-29 20:32:30