10矩形ボックスの入力テキストの書式設定方法

最大10桁の入力テキストボックスが必要です（右揃えが10未満の場合）。入力には20pxの高さと200pxの幅が必要です。入力は10ボックス（10px10px）から構成する必要があります。ユーザーが数字を入力すると、ボックスごとに1桁を表示する必要があります。私は等幅フォントファミリを使用した背景10矩形ボックスの入力テキストの書式設定方法

background-image: repeating-linear-gradient(90deg, black, black 1px, 
transparent 1px, transparent 20px); 
background-position: 100%;

でこれらのボックスをシミュレートするために管理は助けたが、それでも、必要に応じて、それが見て、作品作り傾けます。これは実現可能ですか？そのための小さな作業スニペットを私に提供できますか？

出典

2017-11-02 Danilo C.

シリアル番号入力のようなものを作っていますか？具体的には1つの入力フィールドを使用するか、複数の入力エレメントを使用することを検討しますか？複数の入力を使用する場合は、ある入力から別の入力へ自動進める方法を説明しています（StackOverflow question and answer）。

他にも探していますか？多分、CSSを適用しているマークアップと詳細を提供できますか？

出典

2017-11-02 22:43:21 Rikkokiri

私はこれのためにフィドルを作成しました。 https://jsfiddle.net/gbh7myhj/ 10桁の入力フィールドと1桁の数字を入力したときの入力フィールドは、いずれも「正方形のボックス」のいずれかでなければなりません。 –

最後の桁の文字間隔は「のみ」です。最後の桁の後の文字間隔が存在しない場合は、文字間隔といくつかの右パディングですべてが簡単になります。しかし... –

10矩形ボックスの入力テキストの書式設定方法

答えて

関連する問題