[发明专利]网页表单元素对齐的方法和装置

说明书

技术领域

本发明涉及计算机应用技术领域，尤其涉及一种网页表单元素对齐的方法和装置。

背景技术

目前在网页开发过程中，网页中的表单元素如输入框、单选按钮、复选按钮、下拉框、按钮、文字、图标等默认的样式是不对齐的。但是为了保证网页页面的美观，需要对这些表单元素进行垂直居中对齐，然而目前主流浏览器如IE、谷歌、火狐、360、Safari等对某些表单元素的样式解析不一致；同时对于有多个版本的IE浏览器如IE7、IE8、IE9、IE10，某些表单元素在不同版本的IE浏览器下的表现也不一致。

为了解决上述问题目前处理方式是：当网页提交表单的同一行出现表单元素时，让浏览器默认处理；或者增加一个控制全局居中的vertical-align:middle样式，使同一行的表单元素对齐。但是目前的这种处理方式只能使大多数浏览器浏览网页时实现表单元素的垂直居中对齐，而不能保证所有不同浏览器浏览所述网页时实现表单元素的垂直居中对齐。

发明内容

本发明的主要目的在于解决网页在不同浏览器浏览模式下出现表单元素现不垂直居中对齐的技术问题。

为了实现上述目的，本发明提供一种页面表单元素对齐的方法，包括：

步骤一、将网页的每个表单元素所在父容器的行高调整为对应父容器的高度，并去除所述网页中每个表单元素的内间距和外间距，生成网页共同作用的第一CSS程序代码；

步骤二、调用多个不同的浏览器依次浏览所述网页，当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象，则对所述网页进行该某一浏览器专属样式调整，使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐，为每一个进行专属样式调整的浏览器生成一个网页专属作用的第二CSS程序代码；

将所述第一CSS程序代码和所有第二CSS程序代码组成CSS文件引入所述网页头部，以使所述多个不同的浏览器后续浏览所述网页时实现所有表单元素垂直居中对齐。

优选地，所述调用多个不同的浏览器依次浏览所述网页，当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象，则对所述网页进行该某一浏览器专属样式调整，使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐包括：

预先设置待调用的多个不同浏览器的网页浏览顺序；

根据所述网页浏览顺序，依次调用对应的浏览器浏览所述网页；

当某一浏览器浏览所述网页出现表单元素不垂直居中对齐的现象，则对所述网页进行该某一浏览器专属样式调整，使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐，然后调用下一浏览器浏览所述网页。

优选地，对所述网页进行该某一浏览器专属样式调整具体为：

对所述网页中出现表单元素不垂直居中对齐的所在行内所有表单元素的内间距、外间距进行所述某一浏览器专属样式调整，使所述某一浏览器浏览所述网页时相应行内所有表单元素垂直居中对齐。

优选地，所述多个不同的浏览器包括以下类型的浏览器：IE浏览器、谷歌浏览器、火狐浏览器、360浏览器、Safari浏览器；上述每种类型的浏览器包括至少一个版本的浏览器。

此外，为实现上述目的，本发明还提供一种页面表单元素对齐的装置，包括：

设置模块，用于将网页的每个表单元素所在父容器的行高调整为对应父容器的高度，并去除所述网页中每个表单元素的内间距和外间距，生成网页共同作用的第一CSS程序代码；

调用模块，用于调用多个不同的浏览器依次浏览所述网页，当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象，则对所述网页进行该某一浏览器专属样式调整，使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐，为每一个进行专属样式调整的浏览器生成一个网页专属作用的第二CSS程序代码；

引入模块，用于将所述第一CSS程序代码和所有第二CSS程序代码组成CSS文件引入所述网页头部，以使所述多个不同的浏览器后续浏览所述网页时实现所有表单元素垂直居中对齐。

优选地，所述调用模块，具体用于预先设置待调用的多个不同浏览器的网页浏览顺序；根据所述网页浏览顺序，依次调用对应的浏览器浏览所述网页；当某一浏览器浏览所述网页出现表单元素不垂直居中对齐的现象，则对所述网页进行该某一浏览器专属样式调整，使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐，然后调用下一浏览器浏览所述网页。