Wtforms form field text enlargement

问题

I am new to using wtforms and flask and am trying to enlarge the physical field size and the font inside of it. Should I use a specific piece of code or change it with css.

<div class="container">
<div class="col-md-12">

    <form id="signinform" class="form form-horizontal" method="post" role="form" style="font-size:24px;">
    {{ form.hidden_tag() }}
    {{ wtf.form_errors(form, hiddens="only") }}
    {{ wtf.form_field(form.first_name, autofocus=true) }}
    {{ wtf.form_field(form.last_name) }}
    {{ wtf.form_field(form.company) }}
    {{ wtf.form_field(form.reason) }}
    {{ wtf.form_field(form.us_citizen) }}
    {{ form.signature }}
    </form>

This is what it currently looks like. I want the field to be bigger and the font when typed out to be bigger too.

Thank you in advance, and sorry if this was already answered somewhere else.

回答1:

You can use TextAreaField and define the size.

from wtforms import TextAreaField
from wtforms.widgets import TextArea
class NameForm(Form):
    first_name = TextAreaField('First Name', widget=TextArea())

Add an id into the field you want to enlarge:

{{ form.first_name.label(id='middle')  }}
{{ form.first_name(cols="20", rows="1", id='larger') }}

then define font-size in CSS:

#larger {
font-size: 60px;
}

#middle {
font-size: 40px;
}

来源：https://stackoverflow.com/questions/38749364/wtforms-form-field-text-enlargement