html - Hoe kan de grootte van een invoertekstvak worden gedefinieerd in HTML?

Hier is een tekstvak voor HTML-invoer:

<input type="text" id="text" name="text_name" />

Wat zijn de opties om de grootte van de doos te bepalen?

Hoe kan dit worden geïmplementeerd in CSS?

Antwoord 1, autoriteit 100%

Je zou de widthkunnen instellen:

<input type="text" id="text" name="text_name" style="width: 300px;" />

of nog beter een klasse definiëren:

<input type="text" id="text" name="text_name" class="mytext" />

en pas in een apart CSS-bestand de nodige styling toe:

.mytext {
    width: 300px;
}

Als u het aantal tekens dat de gebruiker in dit tekstvak kan typen wilt beperken, kunt u het kenmerk maxlengthgebruiken:

<input type="text" id="text" name="text_name" class="mytext" maxlength="25" />

Het kenmerk sizewerkt ook

<input size="25" type="text">

Probeer dit

<input type="text" style="font-size:18pt;height:420px;width:200px;">

Of anders

<input type="text" id="txtbox">

met de css:

#txtbox
    {
     font-size:18pt;
     height:420px;
     width:200px;
    }

Je kunt de breedte in pixels instellen via inline styling:

<input type="text" name="text" style="width: 195px;">

U kunt de breedte ook instellen met een zichtbare tekenlengte:

<input type="text" name="text" size="35">

<input size="45" type="text" name="name">

De “grootte” specificeert de zichtbare breedte in karakters van de elementinvoer.

Je kunt ook de hoogte en breedte uit css gebruiken.

<input type="text" name="name" style="height:100px; width:300px;">