一种检测flex布局属性完整性的方法及系统与流程

文档序号:12719384阅读:来源:国知局

技术特征:

1.一种检测flex布局属性完整性的方法,其特征在于,包括以下步骤:

接收待检测的网站地址;

访问所述网站地址对应的网页并获取所述网页的源码;

从网页源码中查找CSS样式文件;

在CSS样式文件中查找是否有flex属性;

查找到flex属性,则继续检测flex属性的个数;检测flex属性的顺序;

没查找到flex属性,则退出,并提示没有flex属性。

2.根据权利要求1所述的检测flex布局属性完整性的方法,其特征在于,所述访问网站地址对应的网页并获取所述网页源代码是通过后台执行完成的。

3.根据权利要求1所述的检测flex布局属性完整性的方法,其特征在于,所述flex属性包括:

5个display属性,所述5个display属性值分别为-webkit-flex、-moz-box、-moz-flex、-ms-flexbox、flex;

6个水平居中属性,分别为-webkit-box-align、-moz-boxx-align、-ms-flex-pack、-webkit-justify-content、-moz-justify-content、justify-content;

6个垂直居中属性,分别为-webkit-box-pack、-moz-boxx-pack、-ms-flex-align、-webkit-align-items、-moz-align-items、align-items;

4个平铺方式属性,分别为-webkit-box-orient、-webkit-flex-direction、-ms-flex-direction、flex-direction;

5个换行属性,分别为-webkit-flex-wrap、-moz-flex-wrap、-ms-flex-wrap、-o-flex-wrap、flex-wrap。

4.根据权利要求3所述的检测flex布局属性完整性的方法,其特征在于,所述flex属性的标准属性值放在所有display属性的最后。

5.根据权利要求1所述的检测flex布局属性完整性的方法,其特征在于,将所述flex布局属性完整性的检测结果以消息框显示,包括:

没有查找到所述flex属性,显示此布局方法为非flex布局;

查找到flex属性,且所述属性个数不对或所述属性排列顺序不对,显示此时代码行数和CSS文件名;

查找到flex属性,且所述属性个数和所述属性排列顺序都对,显示flex布局属性完整的提示。

6.一种检测flex布局属性完整性的系统,其特征在于,包括:

网站地址输入模块,用于接收待检测的网站地址;

网页源码获取模块,与所述网站输入模块相连,用于从所述网站输入模块中获取所述网站地址,访问所述网站地址对应的网页并获取所述网页的源代码;

CSS文件获取模块,用于从所述网页源代码中获取CSS样式文件;

Flex属性查找模块,用于从CSS样式文件中查找flex属性;

Flex属性个数检测模块,用于检测CSS文件中flex属性的个数;

Flex属性顺序检测模块,用于检测CSS文件中flex属性中的各display属性的顺序。

7.根据权利要求6所述的检测flex布局属性完整性的系统,其特征在于,所述访问网站地址对应的网页并获取所述网页源代码是通过后台执行完成的。

8.根据权利要求6所述的检测flex布局属性完整性的系统,其特征在于,所述flex属性包括:

5个display属性,所述5个display属性值分别为-webkit-flex、-moz-box、-moz-flex、-ms-flexbox、flex;

6个水平居中属性,分别为-webkit-box-align、-moz-boxx-align、-ms-flex-pack、-webkit-justify-content、-moz-justify-content、justify-content;

6个垂直居中属性,分别为-webkit-box-pack、-moz-boxx-pack、-ms-flex-align、-webkit-align-items、-moz-align-items、align-items;

4个平铺方式属性,分别为-webkit-box-orient、-webkit-flex-direction、-ms-flex-direction、flex-direction;

5个换行属性,分别为-webkit-flex-wrap、-moz-flex-wrap、-ms-flex-wrap、-o-flex-wrap、flex-wrap。

9.根据权利要求8所述的检测flex布局属性完整性的系统,其特征在于,所述flex属性的标准属性值放在所有display属性的最后。

10.根据权利要求6所述的检测flex布局属性完整性的系统,其特征在于,将所述flex布局属性完整性的检测结果以消息框显示,包括:

没有查找到所述flex属性,显示此布局方法为非flex布局;

查找到flex属性,且所述属性个数不对或所述属性排列顺序不对,显示此时代码行数和CSS文件名;

查找到flex属性,且所述属性个数和所述属性排列顺序都对,显示flex布局属性完整的提示。

当前第2页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1