25

次のtextarea要素があります。

<form action="/checkit" method="get">
    <textarea class="field span8" id="textarea" name="user_input" 
        rows="20">{{default_data}}</textarea>

    <input type="submit" value="Checker">
</form>

を使い始めたばかりbootstrapですが、テキストエリアのテキストをモノスペースにする最良の方法がわかりません。

4

4 に答える 4

37

次をテキストエリアタグに追加すると機能するはずです

 style="font-family:monospace;"

または、このようにcssに追加するだけです

#textarea{font-family:monospace;}
于 2013-01-22T09:26:07.270 に答える
14

Twitter Bootstrap は多くのスタイル設定機能を設定しており、それらをオーバーライドするのは必ずしも簡単ではありません。ただし、特定の要素については、id セレクターのようなかなり特殊なセレクターを使用すると簡単です。あなたの場合、textarea要素には がid="textarea"あるため、たとえば使用できます

<style>
#textarea { font-family: Consolas, Lucida Console, monospace; }
</style>

モノスペース フォントの任意のシーケンスを優先順にリストできますが、最後のエントリmonospace(引用符なし) を最後にします。これは、ブラウザーの既定のモノスペース フォントにフォールバックすることを意味するためです。

でフォントをモノスペースに設定することは、通常、ユーザビリティーにとって良くありませんtextarea。ただし、予想される入力がコンピューター コード、数値の行、またはモノスペース レンダリングに適したその他のテキストである場合を除きます。

于 2013-01-22T09:32:28.960 に答える
2

ブートストラップにはスタイルがあります:

input,
button,
select,
textarea {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

CSS で、これを次のように変更する必要があります。

#textarea { 
font-family: monospace; 
}

したがって、id を使用すると、テキストエリアの優先度が高くなります。

于 2013-01-22T10:56:02.850 に答える