IK.AM

最新のBootstrap2.0では書き方が変わりましたので↓のは使えません。。
代わりにこちらのツールをどうぞ(サンプルが仕様ですｗ)。

テキストフィールド

コード

<div class="clearfix">
    <label for="xlInput">X-Large input</label>
    <div class="input">
        <input class="xlarge" id="xlInput"
            name="xlInput" size="30" type="text">
    </div>
</div>

表示

セレクト

コード

<div class="clearfix">
    <label for="normalSelect">Select</label>
    <div class="input">
        <select name="normalSelect"
            id="normalSelect">
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
        </select>
    </div>
</div>

表示

マルチセレクト

コード

<div class="clearfix">
    <label for="multiSelect">Multiple select</label>
    <div class="input">
        <select class="medium" size="5"
            multiple="multiple" name="multiSelect"
            id="multiSelect">
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
        </select>
    </div>
</div>

表示

編集不可なテキストフィールド

コード

<div class="clearfix">
    <label>Uneditable input</label>
    <div class="input">
        <span class="uneditable-input">Some
            value here</span>
    </div>
</div>

表示

使用不可なテキストフィールド

コード

<div class="clearfix">
    <label for="disabledInput">Disabled
        input</label>
    <div class="input">
        <input class="xlarge disabled"
            id="disabledInput" name="disabledInput"
            size="30" type="text"
            placeholder="Disabled input here… carry on."
            disabled="">
    </div>
</div>

表示

使用不可なテキストエリア

コード

<div class="clearfix">
    <label for="disabledInput">Disabled
        textarea</label>
    <div class="input">
        <textarea class="xxlarge" name="textarea"
            id="textarea" rows="3" disabled=""></textarea>
    </div>
</div>

表示

テキストエリア

コード

<div class="clearfix">
    <label for="textarea">Textarea</label>
    <div class="input">
        <textarea class="xxlarge" id="textarea2"
            name="textarea2" rows="3"></textarea>
        <span class="help-block"> Block of
            help text to describe the field above if
            need be. </span>
    </div>
</div>

表示