表单规范书写

表单元素规范:
一般表单由文字部分,和表单部分组成。文字部分用label标签,表单用input标签。
有时候,文字总是与label不在一条线上,或上或下。所以我们可以用vertical-align来调整文字上下位置。一般默认情况下,文字与表单的对齐是 vertical-align:baseline对齐的。当文字变小是例如,
font-size:12px vertical-align:-3px
font-size:14px vertical-align:-2px

  1. 关于textarea:
    ①固定大小,禁用拖动:在谷歌浏览器和火狐浏览器时,我们会发现文本区元素右下角会有一个小三角鼠标,可以拖一小三角可以放大这个多行文本框,但是在主流浏览器中,IE浏览器是没有这个功能的。所以一般为了破坏页面布局,一般都会静止或者使用这个拖拽功能,所以我们会设置固定大小或者禁止拖动:固定大小:min-width和min-height来定义textarea的最小宽度高度。max-width和max-height来定义textarea的最大宽度和高度。禁止拖动:用resize:none设置textarea

②在Chrome,Firefox和IE中实现相同的外观第一步:用css的width和height定义textarea的宽度和高度
第二步:用overflow:auto来定义textarea得滚动条自适应

  1. 关于表单对齐:
    每一行都是分为左栏和右栏,左栏一般包括文用label标签写的文字,右栏标签包括这一行里所有的input标签。

然后左栏盒子和右栏盒子都设置为左浮动

右栏盒子text-align设置为right,使文字右对齐

最重要的一点是,每一行中左栏长度和右栏所有盒子的总长度之和等于行宽,包括width padding border和margin。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值