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 のヒント
推薦する
MySQLのデフォルトのソートルールに基づく落とし穴
MySQL のデフォルトの varchar 型は大文字と小文字を区別しません (insensitiv...
Vue が天気予報機能を実装
この記事では、天気予報機能を実現するためのVueの具体的なコードを参考までに共有します。具体的な内容...
MySQL 8.0.12 の詳細なインストールおよびアンインストール チュートリアル
1. MySQL 8.0.12 バージョンのインストール手順。 1. ダウンロードhttps://d...
ReactのsetStateがマクロタスクなのかマイクロタスクなのかについて詳しく話しましょう
目次序文面接官は適切な質問をしていますか? § React は setState をどのように制御し...
VMware Workstation Pro 16 グラフィックチュートリアル (CentOS8 仮想マシン クラスタの構築)
目次準備VMware Workstation Pro 16 をインストールするLinux仮想マシンの...
node.jsのインストールとHbuilderXの設定の詳細な説明
npm インストールチュートリアル: 1. Node.jsインストールパッケージをダウンロードする公...
xshellを使用してLinuxサーバーに接続する
xshellを使用してLinuxに接続する利点Windows環境でLinuxを直接操作できるインター...
Linuxでのaliasコマンドの使い方の詳細な説明
1. 別名の使用alias コマンドは、コマンドのエイリアスを設定するために使用されます。このコマン...
仮想マシン VMware に Kali Linux をインストールする最新の超詳細なグラフィック チュートリアル
目次1. システムイメージファイルをダウンロードする2. 新しい仮想マシンを作成する3. Kali ...
MySQL カーソルの定義と使用法
カーソルの作成まず、MySql でデータ テーブルを作成します。 存在しない場合はテーブルを作成 `...
どのような種類の MYSQL 接続クエリを知っていますか?
序文クエリ情報が複数のテーブルから取得される場合、クエリのためにこれらのテーブルを結合する必要があり...
Vueライフサイクルカメラの8つのフック関数
目次1. beforeCreateとcreated関数2. beforeMountとmount関数3...
MySQL 文字列連結関数 GROUP_CONCAT の詳細な説明
前回の記事では、クロステーブル更新について書きました。自分が書いた SQL を見たとき、自分がバカみ...
Vueはページを更新するために3つの方法を使用する
プロジェクトを作成しているときに、ユーザーがアクションを実行し、特定の状態を変更し、ページを更新して...
ログインフォームを実装するためのReactサンプルコード
Vue ユーザーとして、React を拡張する時が来ました。antd の導入、less と rout...