入力のsize属性とmaxlength属性の違い

入力のsize属性とmaxlength属性の違い
最近、プロジェクトで input size 属性と maxlength 属性を使用しました。以前は、この 2 つのタグの違いを気にせずに使用していました。今日、Baidu で検索して、少し理解できました。特別収録しました!

コードをコピー
コードは次のとおりです。

<p>名前: <input type="text" name="fullname" maxlength="5" /></p>
<p>名前2: <input type="text" name="fullname" size="5" /></p>

maxlength="5" の場合、入力ボックスに入力できる文字数は 5 文字のみです<br/>
size="5"は、入力ボックスには5文字しか表示されないが、'無限'の文字を入力できることを意味します。

つまり、size 属性は入力フィールドの幅を指定します (ここでは、Name2 テキスト ボックスには 5 文字のみが表示されます)。
size 属性は視覚的なデザイン属性なので、代わりに CSS で width を使用する必要があります。

CSS構文: <input style="width:100px"/>

<<:  CSS XTHML の記述標準とよくある問題の概要 (ページ最適化)

>>:  CSS ブラウザ互換性の問題に対する 4 つの解決策

推薦する

Centos7.5 構成 Java 環境のインストール Tomcat の説明

Tomcat は Java 言語をベースにした Web サーバー ソフトウェアです。この記事では主に...

js QRコードスキャンログインの原理についての簡単な説明

目次QRコードログインの真髄QRコードを理解するシステム認証メカニズムQRコードをスキャンしてログイ...

PSを使用して2分でxhtml+cssウェブサイトのホームページを作成します

xhtml+css のウェブサイト再構築、ウェブ標準などについては、記事が多すぎるので繰り返しません...

JDBC および MySQL 一時テーブルスペースの詳細な分析

背景一時テーブルスペースは、データベースのソート操作を管理し、一時テーブルや中間ソート結果などの一時...

操作タイムアウトがないときにMySQLサーバーがアクティブに切断される問題を解決します

MySQL サービスを使用する場合、通常の状況では、MySQL のタイムアウト設定は 8 時間 (2...

MySQLのグローバルロックとテーブルロックに関する詳細な理解

序文ロックの範囲に応じて、MySQL のロックは、グローバル ロック、テーブル ロック、行ロックに大...

JS は Web ページナビゲーションバーの特殊効果を実現します

この記事では、ネイティブ JS を使用して実装された実用的な Web ナビゲーション バー効果を紹介...

CSS Houdini でダイナミックな波効果を実現

CSS Houdini は、CSS 分野における最もエキサイティングなイノベーションとして知られてい...

HTML のセルパディングとセルスペース属性を図で説明します

セル - 表の内容 セルの余白 (表の余白) (cellpadding) - セルの外側の距離を表し...

Homebrewを使用してMacにMySQLをインストールするときにログインできない問題を解決する

お使いのコンピュータが Mac の場合、homebrew を使用して MySQL をインストールする...

HTML ページでコンテンツの選択、コピー、右クリックを防止する方法の詳細な説明

時には、Web ページに掲載されているコンテンツが悪意のある人物に盗用されるのを望まないため、Web...

JS ES6における構造化分解についてお話しましょう

概要es6 では、配列またはオブジェクトから指定された要素を取得する新しい方法が追加されました。これ...

Dockerはローカルディレクトリとデータボリュームコンテナ操作をマウントします

1. DockerはローカルディレクトリをマウントしますDocker は、ホスト上のディレクトリをイ...

Vue-Element-Adminはログインジャンプを実現するために独自のインターフェースを統合しています

1. まずリクエスト設定ファイルを見て、axios.createメソッドを見てください。baseUR...