So zentrieren Sie die Schaltfläche-HTML-Tutorial-php.cn

So zentrieren Sie die Schaltfläche

高洛峰

Freigeben： 2017-03-08 16:03:10

Original

24021 Leute haben es durchsucht

Als ich die Seite heute schrieb, stellte ich fest, dass die CSS-Seite text-align="center" schrieb, als ich die Schaltfläche auf zentriert einstellte, aber auch die Verwendung des Anzeigeattributs hatte keine Auswirkung Ich habe es viele Male versucht und festgestellt, dass die Schaltfläche zentriert sein muss. Fügen Sie einfach ein p zur Schaltfläche hinzu und zentrieren Sie dann das p. Schreiben Sie unten einen Test zur Veranschaulichung:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
        p,input,button{
            text-align: center;
    　　}
    </style>
</head>
<body>
    <p>你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊</p>
    <input type="button" value="点我握手哦"/><br/>
    <button type="button">点我呀</button>
</body>
</html>

Nach dem Login kopieren

Seiteneffekt (das p-Tag ist zentriert, aber die Schaltfläche ist nicht zentriert. Sie können Eingabe- und Schaltflächen-Tags verwenden, um Schaltflächen zu erstellen):

So zentrieren Sie die Schaltfläche

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style type="text/css">
        /*p,input,button{
            text-align: center;
        }*/
        p{
            text-align: center;
        }
    </style>
</head>
<body>
    <p>
        <p>你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊你好啊</p>
        <input type="button" value="点我握手哦"/><br/>
        <button type="button">点我呀</button>
    </p>
</body>
</html>

Nach dem Login kopieren

Seiteneffekt:

So zentrieren Sie die Schaltfläche

Dies ist das erste Mal, dass ich einen Blog schreibe, und das tue ich auch auch ein Neuling im Frontend. Wenn es etwas Unangemessenes gibt, sind Korrekturen willkommen, danke

Update: Aufgrund der Ratschläge aus dem ersten Kommentar unten möchte ich etwas mehr hinzufügen, Text ausrichten : Das Attribut gibt die horizontale Ausrichtung des Texts im Element an. Dieses Attribut gibt den Punkt an, an dem die horizontale Ausrichtung des Texts innerhalb des Elements auf Blockebene festgelegt werden soll Sie können auch das Attribut display: block festlegen, um es zu einem Element auf Blockebene zu machen, plus width, margin: 0 auto, um eine Zentrierung zu erreichen.

Das obige ist der detaillierte Inhalt vonSo zentrieren Sie die Schaltfläche. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!