带有下划线的HTML表单,用于手写信息

Ste*_*igg 1 html webforms presentation underline

我需要在HTML中制作一些客户需要打印的表格,然后手工编写一些条目,然后扫描或传真.

所以我希望有一个像Sign"____________"这样的签名区域

如果下划线是有限的长度,下划线都是好的,但是如果我有多条线需要一直穿过页面(或者在某些情况下是表格单元格),每个前面都有一些文本?

所以:

Item 1: ____________
An Item 2: _________
This is item 3: ____
1 more item: _______
Run Code Online (Sandbox Code Playgroud)

问题是如果我使用下划线,下划线不会在相同的位置完成,它看起来不对或它会扭曲单元的大小.最好的办法是强调白色空间,但这是不可能的.

Car*_*icz 6

所以用a构建一些块元素border-bottom.这些看起来像下划线,你可以玩颜色,厚度和诸如此类的东西.

一个实用的解决方案:我会使每一行成为一个2列的表,给左列(带文本)的宽度0%(将扩展到所需的最小值)和右列(带下划线的空)的宽度100%(其中)将占用剩余的空间); 然后我将一个带有底部边框的空块放入右边的表格单元格中.

我的这种设计违反了许多其他网页设计师的理念.我并不是说这是一个非常棒或非常符合标准的设计,我只是声称它很简单而且很有效.