[CSS] フォームの「送信ボタン」を中央揃えに! どの端末で見ても真ん中にする技!! | ヨッセンス
こんにちは! ヨス（プロフィールはこちら）です。 今回は、私が以前、WEBサイトを作っていたときに失敗したことのアウトプットをしたいと思います。それはWEBサイトのお問い合わせフォームとかに出てくる送信するとか内容確認みたいなボタンについてです。 ボタンを真ん中に配置したい! 何に苦戦したかというと、内容確認ボタンを画面の中央に寄せることです。 ちなみにボタンはこんなHTMLを書くと現れます。 <input type="submit" value="内容確認"> ボタンの左に余白を…… 最初、私は<input>タグ自体に、「margin」とかで一生懸命、ボタンの両側に空白を入れようとしていました。 そう。ちょうどこんな感じで、両サイドに空白の自動調整（auto）を入れて、中央揃えをやろうとしていたのですが…… input { margin : 0 auto ; } これが効かない!! 効か
![[CSS] フォームの「送信ボタン」を中央揃えに! どの端末で見ても真ん中にする技!! | ヨッセンス](https://cdn-ak-scissors.b.st-hatena.com/image/square/f426e29e19bbd96112332f038e7e8e4353da620a/height=288;version=1;width=512/https%3A%2F%2Fyossense.com%2Fwp-content%2Fuploads%2Finput-button-center-250.jpg)
エレメントで<input type="text">のみスタイルを変える
フォームのエレメントは<input>タグで指定します。しかし、<input>タグで指定できるエレメントは数多くあります。その中で特定の種類のエレメントのみにスタイルを適用するにはinput[type="エレメントの種類"]とします。あとは通常のスタイルを設定します。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=shift_jis"><title>Sample</title> <style type="text/css"><!-- input { color: red; } input[type="text"] { color: orange; } --></style> </head> <b
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
