Warum ist der Schaltflächentext standardmäßig vertikal zentriert, der Div-Text jedoch nicht?-CSS-Tutorial-php.cn

Warum ist der Schaltflächentext standardmäßig vertikal zentriert, der Div-Text jedoch nicht?

Susan Sarandon

Freigeben： 2024-10-26 12:06:02

Original

845 Leute haben es durchsucht

Why is Button Text Vertically Centered by Default, but Div Text Isn't?

Informationen zur vertikalen Ausrichtung von Schaltflächentexten

Berücksichtigen Sie die folgenden HTML-Markup- und CSS-Stile:

<code class="html"><button class="button">Some Text</button>
<div class="button">Some Text</div></code>

Nach dem Login kopieren

<code class="css">.button {
  background: darkgrey;
  height: 40px;
  border: 2px solid grey;
  width: 100%;
  box-sizing: border-box;
  font-size: 14px;
  font-family: helvetica;
  text-align: center;
  margin-bottom: 20px;
}</code>

Nach dem Login kopieren

Wenn Sie diese Stile anwenden, Sie bemerken, dass der Text innerhalb der -Element vertikal ausgerichtet ist, wohingegen der Text innerhalb des

ist nicht.

Die geheimnisvolle Magie

Standardmäßig ist

Quelle：php.cn

Vorheriger Artikel：Warum erbt ein absolut positioniertes Element innerhalb eines relativ positionierten Elements seine Position von seinem unmittelbaren übergeordneten Element? Nächster Artikel：Wie gestaltet man das „mat-select“-Panel in eckigem Material effektiv?

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

Aktuelle Ausgaben

function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc...

Aus 2024-04-29 11:01:01

1684

So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln?

Aus 2024-04-23 00:22:19

1838

Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht.

Aus 2024-04-19 15:37:47

1561

Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter...