网页表单元素对齐的方法和装置的制造方法

文档序号:8531860阅读:438来源:国知局
网页表单元素对齐的方法和装置的制造方法
【技术领域】
[0001]本发明涉及计算机应用技术领域,尤其涉及一种网页表单元素对齐的方法和装置。
【背景技术】
[0002]目前在网页开发过程中,网页中的表单元素如输入框、单选按钮、复选按钮、下拉框、按钮、文字、图标等默认的样式是不对齐的。但是为了保证网页页面的美观,需要对这些表单元素进行垂直居中对齐,然而目前主流浏览器如IE、谷歌、火狐、360、Safari等对某些表单元素的样式解析不一致;同时对于有多个版本的IE浏览器如IE7、IE8、IE9、IE10,某些表单元素在不同版本的IE浏览器下的表现也不一致。
[0003]为了解决上述问题目前处理方式是:当网页提交表单的同一行出现表单元素时,让浏览器默认处理;或者增加一个控制全局居中的vertical-align:middle样式,使同一行的表单元素对齐。但是目前的这种处理方式只能使大多数浏览器浏览网页时实现表单元素的垂直居中对齐,而不能保证所有不同浏览器浏览所述网页时实现表单元素的垂直居中对齐。

【发明内容】

[0004]本发明的主要目的在于解决网页在不同浏览器浏览模式下出现表单元素现不垂直居中对齐的技术问题。
[0005]为了实现上述目的,本发明提供一种页面表单元素对齐的方法,包括:
[0006]步骤一、将网页的每个表单元素所在父容器的行高调整为对应父容器的高度,并去除所述网页中每个表单元素的内间距和外间距,生成网页共同作用的第一 CSS程序代码;
[0007]步骤二、调用多个不同的浏览器依次浏览所述网页,当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐,为每一个进行专属样式调整的浏览器生成一个网页专属作用的第二 CSS程序代码;
[0008]将所述第一 CSS程序代码和所有第二 CSS程序代码组成CSS文件引入所述网页头部,以使所述多个不同的浏览器后续浏览所述网页时实现所有表单元素垂直居中对齐。
[0009]优选地,所述调用多个不同的浏览器依次浏览所述网页,当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐包括:
[0010]预先设置待调用的多个不同浏览器的网页浏览顺序;
[0011]根据所述网页浏览顺序,依次调用对应的浏览器浏览所述网页;
[0012]当某一浏览器浏览所述网页出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐,然后调用下一浏览器浏览所述网页。
[0013]优选地,对所述网页进行该某一浏览器专属样式调整具体为:
[0014]对所述网页中出现表单元素不垂直居中对齐的所在行内所有表单元素的内间距、外间距进行所述某一浏览器专属样式调整,使所述某一浏览器浏览所述网页时相应行内所有表单元素垂直居中对齐。
[0015]优选地,所述多个不同的浏览器包括以下类型的浏览器:IE浏览器、谷歌浏览器、火狐浏览器、360浏览器、Safari浏览器;上述每种类型的浏览器包括至少一个版本的浏览器。
[0016]此外,为实现上述目的,本发明还提供一种页面表单元素对齐的装置,包括:
[0017]设置模块,用于将网页的每个表单元素所在父容器的行高调整为对应父容器的高度,并去除所述网页中每个表单元素的内间距和外间距,生成网页共同作用的第一 CSS程序代码;
[0018]调用模块,用于调用多个不同的浏览器依次浏览所述网页,当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐,为每一个进行专属样式调整的浏览器生成一个网页专属作用的第二 CSS程序代码;
[0019]引入模块,用于将所述第一CSS程序代码和所有第二 CSS程序代码组成CSS文件引入所述网页头部,以使所述多个不同的浏览器后续浏览所述网页时实现所有表单元素垂直居中对齐。
[0020]优选地,所述调用模块,具体用于预先设置待调用的多个不同浏览器的网页浏览顺序;根据所述网页浏览顺序,依次调用对应的浏览器浏览所述网页;当某一浏览器浏览所述网页出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐,然后调用下一浏览器浏览所述网页。
[0021]优选地,所述调用模块,具体还用于对所述网页中出现表单元素不垂直居中对齐的所在行内所有表单元素的内间距、外间距进行所述某一浏览器专属样式调整,使所述某一浏览器浏览所述网页时相应行内所有表单元素垂直居中对齐。
[0022]优选地,所述多个不同的浏览器包括以下类型的浏览器:IE浏览器、谷歌浏览器、火狐浏览器、360浏览器、Safari浏览器;上述每种类型的浏览器包括至少一个版本的浏览器。
[0023]本发明所提供的网页表单元素对齐的方法和装置,通过将网页的每个表单元素所在父容器的行高调整为对应父容器的高度,并去除所述网页中每个表单元素的内间距和外间距,生成网页共同作用的第一 CSS程序代码;调用多个不同的浏览器依次浏览所述网页,当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐,为每一个进行专属样式调整的浏览器生成一个网页专属作用的第二 CSS程序代码;将所述第一 CSS程序代码和所有第二 CSS程序代码组成CSS文件引入所述网页头部的方式,能够解决浏览器浏览所述网页出现表单元素不垂直居中对齐的问题,实现不同浏览器浏览所述网页时所有表单元素垂直居中对齐。
【附图说明】
[0024]图1为本发明的页面表单元素对齐的方法第一实施例的流程图;
[0025]图2是本发明的调用多个不同的浏览器依次浏览网页的流程示意图;
[0026]图3是本发明的页面表单元素对齐的装置第一实施例的功能模块示意图。
[0027]本发明目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。
【具体实施方式】
[0028]应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
[0029]本发明提供一种页面表单元素对齐的方法,参见图1,图1为本发明的页面表单元素对齐的方法第一实施例的流程图。在第一实施例中,所述页面表单元素对齐的方法包括:
[0030]步骤S10、将网页的每个表单元素所在父容器的行高调整为对应父容器的高度,并去除所述网页中每个表单元素的内间距和外间距,生成网页共同作用的第一 CSS程序代码。
[0031]本步骤SlO的设置属于公同作用样式设置,将所述第一 CSS程序代码引用网页中可以保证所述网页在大部分浏览器的浏览模式下能够实现表单元素垂直居中对齐。另外,本实施例中还可以对所述网页中的字体和字体大小进行设置,根据网页的每个表单元素所在父容器行高、每个表单元素的内外间距、以及网页中的字体和字体大小,生成网页共同作用的第一 CSS程序代码。
[0032]步骤S20、调用多个不同的浏览器依次浏览所述网页,当某一浏览器浏览所述网页时出现表单元素不垂直居中对齐的现象,则对所述网页进行该某一浏览器专属样式调整,使该某一浏览器浏览所述网页时所有表单元素垂直居中对齐,为每一个进行专属样式调整的浏览器生成一个网页专属作用的第二 CSS程序代码。
[0033]步骤S30、将所述第一 CSS程序代码和所有第二 CSS程序代码组成CSS文件引入所述网页头部,以使所述多个不同的浏览器后续浏览所述网页时实现所有表单元素垂直居中对齐。
[0034
当前第1页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1