コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > 入力テキストボックスと画像検証コードの作成方法

入力テキストボックスと画像検証コードの作成方法

php中世界最好的语言
リリース： 2018-02-12 10:04:13
オリジナル
3537 人が閲覧しました

在制作网页过程中经常会将input 和 img 放在同一行实现左侧输入右侧验证码，不过与此同时出现的一个问题是文本框和验证码的水平对齐问题，下面与大家分享下具体的解决方法，有类似问题的朋友可以了解下哈

在网页制作中，常将 input 和 img 放在同一行，img标签总是比input高出一个头，非常难看。

CCS实现input和img水平对齐的方法
同时给input和img添加vertical-align:middle就行了，代码如下： 

input,img {vertical-align:middle;}
ログイン後にコピー

相信看了这些案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

相关阅读：

iframe的去边框和无边框有哪些操作方式

Html中有哪些标记文字注释的符号

html的转义字符怎样通过代码识别

以上が入力テキストボックスと画像検証コードの作成方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル：
input 確認する
ソース：php.cn
前の記事：よく使用される入力テキスト ボックスの内容は自動的に垂直方向の中央に配置され、クリックするとデフォルトのプロンプト テキストは空になります。 次の記事：HTML でスクロール バーを使用するためのヒントは何ですか?
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
Web サイトから入力要素を取得できません そこで、Twitter から入力要素を取得しようとしていますが、それを実行すると、ノード ターミナルでこのようなエラーが表示され続け、その結果、このコードによって作成されたブラウザ...
から 2024-04-06 18:59:57
0
1
442
ベンダー固有の疑似要素上の JavaScript ホバー イベント 次の htmlinput タグがあります。 $("input[type='range']::-webkit-slider-thumb").on('hover',...
から 2024-04-06 15:35:24
0
1
274
HTML テーブル内のオブジェクトのネストされた配列を反復して表示します ネストされたオブジェクトの配列を含む次の入力があります。 summary は親オブジェクト配列、run_type はネストされたオブジェクト配列です。 letinput={&quo...
から 2024-04-05 14:11:42
0
1
1373
React に入力の終了タグをレンダリングさせますか? 珍しいお願いがあります。私の Web サイトは React を使用して構築されており、公開 Web サイトの HTML を自分の React コンポーネントにコピーできるようにした...
から 2024-04-03 23:01:01
0
1
320
Shopware 6 プラグイン: ブール構成を削除して複数選択構成に移行する方法 現在、プラグインを通じて送信されたレビューを自動的に公開するブール型 reviewSkipModeration 値で構成されている Shopware6 プラグインがあります: co...
から 2024-04-03 23:09:28
0
1
410
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート