单击以填充文本

Question

我一直在使用以下：

<form onsubmit="javascript: alert('sending...'); return false;">
<input type="text" id="screen" />
<div id="keypad">
    <button>7</button>
    <button>8</button>
    <button>9</button>
    <br />
    <button>4</button>
    <button>5</button>
    <button>6</button>
    <br />
    <button>1</button>
    <button>2</button>
    <button>3</button>
    <br />
    <button>0</button>
</div>
</form>

window.onload = function () {
    var screen  = document.getElementById('screen'),
        keypad  = document.getElementById('keypad'),
        buttons = keypad.getElementsByTagName('button');
    for (var i = 0; i < buttons.length; i++) {
        buttons[i].onclick = function () {
            screen.value = screen.value + this.innerHTML;
            return false;
        };
    }
};

(http://jsfiddle.net/nTzY4/3/)

我想让文本框更大，我该怎么做？想要身高和身长更大。

Answer 1

像这样添加一个类并让 css 改变你的元素

.bigger
{
    width: 100px;
    height: 30px;
}

<input class="bigger" type="text" id="screen" />

Answer 2

CSS 是解决方案：

#screen
{
    width: 500px;
    height: 50px;
    font-size: 40px;
}
#keypad button
{
    width: 165px;
    height: 50px;
}

在 JsFiddle 中你把它放在 CSS 部分，在真正的网站中你把它放在你的 .css 文件中：http://www.w3schools.com/css/css_howto.asp