一种CSS资源前端显示方法技术

本发明专利技术提供一种CSS资源前端显示方法，包括：向一WEB服务器发送包含一用户配置信息的页面资源请求，用于指示所述WEB服务器根据所述页面资源请求确定对应的页面资源文件，以及根据所述用户配置信息从预设的第一CSS文件和第二CSS文件中筛选出需要输出到前端的CSS资源文件，并对所述CSS资源文件设定在用户端的引入顺序；接收所述页面资源文件和CSS资源文件，并根据所述引入顺序在客户端上加载所述CSS资源文件来进行显示，本发明专利技术可以满足用户在客户端浏览页面的各种需求，此外，由于各种CSS资源文件为预先设置在服务器中的，故可以做到全面的兼容性。

CSS resource front end display method

The invention provides a CSS source front-end display method, including: contains a user configuration information sent to a WEB server page resource request is used for indicating the WEB server according to the resource request page to determine the corresponding page resource file, and according to the user configuration information from the first CSS file and CSS file default second selected to output to the front end of the CSS resource file, and set the CSS resource file in order to introduce user terminal; receiving the page resource file and CSS resource file, and the introduction of the order according to the load on the client of the CSS resource file to display, the invention can meet various needs. User browsing in the client in addition, due to a variety of CSS resource file for the preset in the server, it can achieve full compatibility.

【技术实现步骤摘要】
一种CSS资源前端显示方法
本专利技术涉及WEB软件前端
，特别是涉及WEB前端CSS资源请求处理方法和CSS资源前端显示方法。
技术介绍
随着网络技术的发展，用户在各种智能电子设备上进行网页浏览来获取所需的内容。网页提供者为了提升用户体验，会对页面的内容进行丰富化和个性化，以迎合用户来达到提升用于体验的效果。提升用户体验最直接的方法就是丰富web前端资源的内容；Web前端由Html、CSS、Javascript等元素组成，这些技术的应用，使得网站在视觉、操作效果等方面得到很大的提升，但是另一方面，这些效果并不能在所有用户所使用的智能电子设备上进行兼容显示，因为，用户所使用的浏览器、显示设备以及显示屏幕的分辨率等存在差异，上述web前端资源未必能做到全面的兼容。目前，为了解决web前端资源兼容性的问题的方法主要有以下两种：一种，为解决浏览器兼容性问题在引入的CSS(英文全称CascadingStyleSheets，中文简称：层叠样式表)文件中设置只有某种特定浏览器能够识别的“伪类”，这样特定浏览器就只能读取这个“伪类”的样式；另一种，为解决多显示设备、多分辨率问题在页面加载完成后，通过执行一个脚本来判断设备类型、分辨率大小来动态引入对应的CSS；为满足用户个性化需求，提供了若干皮肤允许用户自行切换。上述现有做法虽然可以在一定程度上解决前端资源兼容性的问题，但并不全面，例如，采用“伪类”的方式虽然可以一定程度上解决浏览器兼容问题，但目前市面上浏览器种类繁多，主流的IE6-IE11、Chrome、Firefox、Safari、360等加起来就有15种以上，“伪类”的数量大增，导致CSS过于臃肿，在互联网发展的今天，这会导致网站的下行流量大增，增加服务器负担影响用户体验；再例如，动态执行脚本的方式可以解决跨设备的问题，但是由于是二段加载，部分客户端会有较为明显的卡顿，影响用户体验。综上所述，如何使web前端资源能够在用户端实现全面兼容，并且不影响用户体验，这是目前本领域技术人员所要解决的问题。
技术实现思路
鉴于以上所述现有技术的缺点，本专利技术的目的在于提供一种CSS资源前端显示方法，用于解决如何使web前端资源能够在用户端实现全面兼容且不影响用户体验的问题。为实现上述目的及其他相关目的，本专利技术提供以下技术方案：一种CSS资源前端显示方法，包括：向一WEB服务器发送包含一用户配置信息的页面资源请求，用于指示所述WEB服务器根据所述页面资源请求确定对应的页面资源文件，以及根据所述用户配置信息从预设的第一CSS文件和第二CSS文件中筛选出需要输出到前端的CSS资源文件，并对所述CSS资源文件设定在用户端的引入顺序；接收所述页面资源文件和CSS资源文件，并根据所述引入顺序在客户端上加载所述CSS资源文件来进行显示。本方案可以满足用户在客户端浏览页面的各种需求，此外，由于各种CSS资源文件为预先设置在服务器中的，故可以做到全面的兼容性。优选地，所述用户配置信息包括当前的登录用户信息、设备信息、分辨率信息以及当前页面的浏览器版本信息。优选地，所述CSS资源文件设定在页面引入的顺序为：按照系统级、用户级、浏览器级、屏幕级、风格级、页面级顺序进行显示输出。如上所述，本专利技术通过系统级定义全局样式，用户级定义针对某类用户或者某个用户的个性化样式，浏览器级将各个浏览器的样式分割成不同文件分而治之解决浏览器兼容问题，屏幕级定义各种大小显示设备上的字体、间距、图片等内容，风格级定义允许用户切换的各种，页面级定义了某个页面特有的样式拥有最高优先级。根据CSS样式规则，后输出的资源在同名时具有高优先级，即后输出的样式覆盖先输出的样式。固能支持多显示设备，又支持多分辨率、多浏览器，还能够满足用户的个性化需求。附图说明图1为一种WEB前端CSS资源请求处理方法的流程图。图2为一种CSS资源前端显示方法的流程图。具体实施方式以下通过特定的具体实例说明本专利技术的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本专利技术的其他优点与功效。本专利技术还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本专利技术的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，以下实施例及实施例中的特征可以相互组合。见图1，本实施例提供一种WEB前端CSS资源请求处理方法，其包括以下步骤：步骤一，接收用户端发送的页面资源请求，页面资源请求包含一用户配置信息；步骤二，根据所述页面资源请求确定对应的页面资源文件，以及根据所述用户配置信息从预设的第一CSS文件和第二CSS文件中筛选出需要输出到前端的CSS资源文件，并对所述CSS资源文件设定在页面引入的顺序；步骤三，将所述页面资源文件和CSS资源文件返回所述用户端。具体的，所述用户配置信息包括当前的登录用户信息、设备信息、分辨率信息以及当前页面的浏览器版本信息。具体的，所述CSS资源文件设定在页面引入的顺序为：按照系统级、用户级、浏览器级、屏幕级、风格级、页面级顺序进行显示输出。基于上述方案，一般由WEB服务器来响应用户在客户端上页面资源请求，WEB服务器预先设置有第一CSS文件和第二CSS文件，其中，第一CSS文件中预先储存有适用于在各种显示设备、浏览器以及显示屏幕分辨率条件下的通用CSS样式，而第二CSS资源文件中则储存有各种与用户信息相关的CSS资源文件，那么根据页面资源请求中的用户配置信息会分别从其中选择对应的CSS资源文件，然后与页面资源一起返回至客户端进行显示，这样既能满足用户的体验需求，同时可以做到全面的兼容性显示，而且不会造成服务器负担。例如，用户在访问一个门户网站时，如果用户没有注册为会员，那么页面上所显示的各种CSS资源文件是被保存在WEB服务器的第一CSS文件中，如果用户注册成为了该门户网站的会员，并且拥有了自己的主页，然后进行了一些个性化的设置，那么这些个性化设置所对应的CSS资源文件则保存在第二CSS文件中。根据本专利技术的另一方面，即从客户端侧来对本专利技术进行描述和保护，见图2，提供了一种CSS资源前端显示方法，包括以下步骤：步骤S21，向一WEB服务器发送包含一用户配置信息的页面资源请求，用于指示所述WEB服务器根据所述页面资源请求确定对应的页面资源文件，以及根据所述用户配置信息从预设的第一CSS文件和第二CSS文件中筛选出需要输出到前端的CSS资源文件，并对所述CSS资源文件设定在用户端的引入顺序；步骤S22，接收所述页面资源文件和CSS资源文件，并根据所述引入顺序在客户端上加载所述CSS资源文件来进行显示。根据上述方法，可以满足用户在客户端浏览页面的各种需求，此外，由于各种CSS资源文件为预先设置在服务器中的，故可以做到全面的兼容性。为了更好的阐述本专利技术提供的技术方案，下面将结合本专利技术在实际中的一具体应用来予以进一步说明。步骤S101,建立一个缺省样式的根目录clientfiles,用来将所有系统自带的资源同统一管理。在根目录clientfiles下建立base、browsers、screens、theme目录。其中base目录中存放所有浏览器、屏幕、风格、用户均无关的标准通用样式、脚本以及图片；browsers目录中仅存放用于本文档来自技高网...

【技术保护点】
一种CSS资源前端显示方法，其特征在于，包括：向一WEB服务器发送包含一用户配置信息的页面资源请求，用于指示所述WEB服务器根据所述页面资源请求确定对应的页面资源文件，以及根据所述用户配置信息从预设的第一CSS文件和第二CSS文件中筛选出需要输出到前端的CSS资源文件，并对所述CSS资源文件设定在用户端的引入顺序；接收所述页面资源文件和CSS资源文件，并根据所述引入顺序在客户端上加载所述CSS资源文件来进行显示。

【技术特征摘要】
1.一种CSS资源前端显示方法，其特征在于，包括：向一WEB服务器发送包含一用户配置信息的页面资源请求，用于指示所述WEB服务器根据所述页面资源请求确定对应的页面资源文件，以及根据所述用户配置信息从预设的第一CSS文件和第二CSS文件中筛选出需要输出到前端的CSS资源文件，并对所述CSS资源文件设定在用户端的引入顺序；接收所述页面资源文件和CSS资源文件，并根据所述引...

【专利技术属性】
技术研发人员：江勇，冉露，吴晟昊，罗敏，王钰博，吴诚，徐江湖，
申请(专利权)人：重庆南华中天信息技术有限公司，
类型：发明
国别省市：重庆,50