Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Warum füllen Eingabefelder den verfügbaren Platz nicht mit „width: auto' aus?

Patricia Arquette
Freigeben: 2024-10-28 06:42:02
Original
189 Leute haben es durchsucht

Why Don't Input Fields Fill Available Space with `width: auto`?

Breite:auto für Eingabefelder

Problem:

Breite:auto für Anzeige: Blockelemente sollen den verfügbaren Raum ausfüllen. Bei Eingabefeldern scheint dieses Verhalten jedoch inkonsistent zu sein.

Fragen:

  1. Was genau bedeutet width:auto in CSS?
  2. Gibt es eine Möglichkeit, dafür zu sorgen, dass Eingabefelder wie andere Elemente auf Blockebene den verfügbaren Platz ausfüllen?

Antwort:

1. Bedeutung von width:auto:

Die Breite einer Eingabe wird durch den Standardwert ihres Größenattributs bestimmt. Breite:auto setzt die Breite auf diesen Standardwert.

2. Erzielen des erwarteten Verhaltens:

Damit Eingabefelder den verfügbaren Platz ausfüllen, verwenden Sie width:100 % wie folgt:

<code class="html"><form style='width:200px;background:khaki'>
  <input style='width:100%' />
</form></code>
Nach dem Login kopieren

Hinweis: Bei dieser Methode ist dies möglicherweise nicht der Fall funktionieren aufgrund der Unterschiede in der Randanwendung perfekt in allen Browsern.

Das obige ist der detaillierte Inhalt vonWarum füllen Eingabefelder den verfügbaren Platz nicht mit „width: auto' aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!