html实现表单样式的心得和目前遇到的问题

表单实践效果：

介绍：一共两个表单，通过按钮进行切换，切换的逻辑很简单，一个表单div的display设置为none，另一个block，我通过JS来实现点击触发切换样式就行了。

对齐方式：

看到网页模板的时候，第一眼就是所有的input元素都是对齐的，所以将每一行设为一个ul>li*2就行了第一个li设定一个固定宽度，内的文本全部向右对齐，第二个li放input元素，两个li通过浮动来水平排列，通过外边距和内边距调整每行的间距和内部的间距。但是要注意，因为所有input所在区块的右边显然也是对齐的，所以第二个li很明显应该定好宽度。

input内的提示文字：

对于type="text"这样input元素来说，想加上提示文字就只需要使用属性placeholder就行了，placeholder=“提示文字”。但是对于date来说，想直接加上提示文字就比较困难了，因为这个元素不允许直接输入文本，所以我在实现表单中的：
这里的文字，我是通过绝对定位加上去的，设置好了需要提示的文字和大小，背景和date的背景一致就行了，再使用JS的onchange事件去触发让只要date内的内容不为空就将提示部分的display设为none；就可以达到效果了。

问题：

目标样式：

目前我还没有找到方法改变这里的样式。
上面这个样式我没有做出来，但是已经有了思路了，如果想达到这样的效果，直接用select，很难做到。提示文字其实难度不大。下面是核心代码：