Comment centrer le bouton-tutoriel HTML-php.cn

Comment centrer le bouton

高洛峰

Libérer： 2017-03-08 16:03:10

original

24055 Les gens l'ont consulté

Quand j'écrivais une page aujourd'hui, j'ai découvert qu'en plaçant le bouton au centre, j'écrivais text-align="center" sur la page CSS, mais cela ne fonctionnait pas. Même l'utilisation de l'attribut display n'avait aucun effet. . J'ai essayé plusieurs fois et j'ai découvert que je devais placer le bouton au centre. Ajoutez simplement un p au bouton, puis centrez le p. Écrivez un test ci-dessous pour illustrer :

<!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>

Copier après la connexion

Effet de page (la balise p est centrée, mais le bouton n'est pas centré. Vous pouvez utiliser les balises input et bouton pour créer des boutons) :

Comment centrer le bouton

<!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>

Copier après la connexion

Effet de page :

Comment centrer le bouton

C'est la première fois que j'écris un blog et je suis également un débutant sur le front-end. S'il y a quelque chose d'inapproprié, les corrections sont les bienvenues, merci

Mise à jour : Grâce aux conseils du premier commentaire ci-dessous, j'aimerais en ajouter un peu plus, aligner le texte. : L'attribut spécifie l'alignement horizontal du texte dans l'élément. Cet attribut spécifie la zone de ligne avec laquelle aligner pour définir l'alignement horizontal du texte dans l'élément de niveau bloc. , vous pouvez également définir l'attribut display: block pour en faire un élément de niveau bloc, plus width, margin: 0 auto pour réaliser le centrage.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!