webentwicklung-frage-antwort-db.com.de

So erstellen Sie ein <div> oder ein <a href="#"> zum Ausrichten der Mitte

Ich verwende den folgenden Code im Hauptabschnitt.

<center><a href="contact.html" class="button large hpbottom">Get Started</a></center>

Gibt es eine Alternative für <center>-Tag?

Wie kann ich es zentrieren, ohne <center>-Tag zu verwenden?

center
11
Gilchrist Adam

Fügen Sie der Klasse css text-align:center;display:block; hinzu. Besser als einen Stil für die Steuerelemente selbst festzulegen. Wenn Sie es ändern möchten, tun Sie dies an einer Stelle.

13
Fred

Du kannst das:

<div style="text-align: center">
    <a href="contact.html" class="button large hpbottom">Get Started</a>
</div>
9
Misha Zaslavsky

Sie können einen Absatz einfügen

<p style="text-align:center;"><a href="contact.html" class="button large hpbottom">Get Started</a></p>

Um ein Div in der Mitte auszurichten, müssen Sie zwei Schritte ausführen: - Legen Sie fest, dass das div eine feste Breite hat

<div class="container">
 <div style="width:100px; margin:0 auto;">
     <span>a centered div</span>
  </div>
</div>
1
pazcal

Sie können css wie folgt verwenden.

 <a href="contact.html" style="margin:auto; text-align:center; display:block;" class="button large hpbottom">Get Started</a>
1
Bahattin Ungormus

Sie können den folgenden Code verwenden:

a {
display: block;
width: 113px;
margin: auto; 
}

Wenn Sie in meinem Fall den Link auf display:block setzen, ist es einfacher, den Link zu positionieren.
Dies funktioniert auch, wenn Sie ein <div>-Tag/eine Klasse verwenden.
Sie können eine beliebige width auswählen.

0
Thomas

Ich weiß nicht warum, aber bei mir funktionierttext-align:center;nur mit:

text-align: grid;

OR

display: inline-grid;

Ich habe nachgesehen und kein Stil hat Vorrang.

Meine Struktur:

<ul>
    <li>
        <a>ElementToCenter</a>
    </li>
</ul>

Wenn jemand weiß, warum display: block; nicht funktioniert, kommentieren Sie dies bitte.

0
ℛɑƒæĿ