HTMLボタンを中央に配置する方法
|
HTML ボタン自体を中央に配置するにはどうすればよいでしょうか? このアイデアは簡単に見つかります。次のように、親タグに center 属性を設定します。
<html>
<本文>
<center><button onClick="myClick()">私を攻撃してください</button></center>
<スクリプト>
関数 myClick()
{
警告("123");
}
</スクリプト>
</本文>
</html>
または：
<html>
<本文>
<div align="center"><button onClick="myClick()">私を攻撃してください</button></div>
<スクリプト>
関数 myClick()
{
警告("123");
}
</スクリプト>
</本文>
</html>ボタンを水平に中央揃えにする ボタンはインライン ブロックレベル要素 display:inline-block; です。 解決策は非常に簡単で、次の 2 つの方法があります。 方法1: <div style="text-align:center"> <button>ボタン中央</button> </div> 方法2: <div> <button style="display:block;margin:0 auto">ボタンを中央に配置</button> </div> HTML ボタンを中央に配置する方法についてはこれで終わりです。HTML ボタンを中央に配置する方法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: CSSで記事の区切り線のスタイルを実装するさまざまな方法のまとめ
>>: 誰もが知っておくべきウェブサイトのユーザビリティに関する 10 のヒント
推薦する
Javascriptの基礎を学ぶための10の重要な質問
目次1. Javascript とは何ですか? 2. DOMとは何か3. JSコードの実行方法4. ...
aタグ内のテキストを非表示にして画像を表示するには？360モードレンダリングに対応
多くの場合、画像を表示する<a>タグのスタイルに遭遇しますが、タグ内にテキストがあり、そ...
HTML コマンドラインインターフェースの実装
HTML部分コードをコピーコードは次のとおりです。 <!DOCTYPE html> &l...
Windows2008 64 ビット システムでの MySQL 5.7 グリーン バージョンのインストール チュートリアル
序文この記事では、MySQL 5.7 グリーン バージョンのインストール チュートリアルを紹介します...
Vue での this.$set の動的データバインディングのケーススタディ
インターネット上の this.$set の説明はわかりにくいと感じます。単一データ、オブジェクト、配...
MySQL slow_log テーブルを InnoDB エンジンに変更することはできません。詳細な説明
背景mysql.slow_log からスロー クエリ ログを取得するのは遅く、テーブルは csv テ...
1 つの記事で MySQL のプリコンパイルを理解する
1. プリコンパイルの利点私たちは皆、プリコンパイル機能を備えた JDBC の PreparedSt...
Centos7 で yum を使用して Ceph 分散ストレージをインストールするチュートリアル
目次序文yumソース、epelソースを設定するCephソースの設定Cephとそのコンポーネントをイン...
LinuxのCentos7でmysql5.7.29を構築する詳細なプロセス
1. MySQLをダウンロードする1.1 ダウンロードアドレスhttps://downloads.m...
圧縮パッケージを使用して Linux 環境に JDK 13 をインストールする方法
JDK とは何ですか?まあ、この質問がわからないのであれば、なぜこれをインストールするのか本当にわか...
dockerコンテナにviコマンドをインストールする簡単な操作
docker コンテナを使用する場合、vim がインストールされていないことがあり、vim コマンド...
Linuxでのaliasコマンドの使い方の詳細な説明
1. 別名の使用alias コマンドは、コマンドのエイリアスを設定するために使用されます。このコマン...
ダイナミッククロックを実現するJS+CSS
この記事の例では、動的な時計を実装するためのJS + CSSの具体的なコードを参考までに共有していま...
CSS3 テキストアニメーション効果
効果 html <div class="sp-container">...
Docker環境でMySQLを実行し、Binlogを有効にしてマスタースレーブ同期を構成する方法
同じサーバーで、Docker を使用して Mysql のマスター スレーブ同期設定をシミュレートしま...