CN113420248A - 一种栏目外框样式定义方法 - Google Patents

一种栏目外框样式定义方法 Download PDF

Info

Publication number
CN113420248A
CN113420248A CN202110721366.8A CN202110721366A CN113420248A CN 113420248 A CN113420248 A CN 113420248A CN 202110721366 A CN202110721366 A CN 202110721366A CN 113420248 A CN113420248 A CN 113420248A
Authority
CN
China
Prior art keywords
column
style
outer frame
skin
scss
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202110721366.8A
Other languages
English (en)
Inventor
胡杨
张旭明
谭敏锋
徐石
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Seeyon Internet Software Corp
Original Assignee
Beijing Seeyon Internet Software Corp
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Seeyon Internet Software Corp filed Critical Beijing Seeyon Internet Software Corp
Priority to CN202110721366.8A priority Critical patent/CN113420248A/zh
Publication of CN113420248A publication Critical patent/CN113420248A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • Document Processing Apparatus (AREA)

Abstract

本发明公开了一种栏目外框样式定义方法，栏目外框包括栏目外框样式组成、样式模板文件定义以及目录结构，其中，栏目外框样式主要由栏目边框样式、栏目头部样式、栏目内容样式组成。本发明支持可视化控制栏目的外框样式，同时能够统一控制门户中栏目的外框样式。

Description

一种栏目外框样式定义方法
技术领域
本发明涉及栏目外框样式定义技术领域，具体为一种栏目外框样式定义方法。
背景技术
Web技术的发展，使得管理系统的开发更方便、功能更强大，在此系统的开发过程中，Web技术起了一个骨架式的支持作用；与此同时组件技术的发展为系统的开放性、集成性提供了便利，有效合理地引入组件技术是当前Web系统开发与发展的一个方向；通过对系统的开发进行建模，形象直观的图形化表示，可以显示系统的流程与功能。选择有效的建模方法，充分利用Web技术与组件技术，提高软件的开发效率，提高的软件的可靠性和可维护性，是每个软件开发人员所关心的问题。
现有的web栏目的外框样式无法实现可视化控制，因此，有必要进行改进。
发明内容
本发明的目的在于提供一种栏目外框样式定义方法，以解决上述背景技术中提出的问题。
为实现上述目的，本发明提供如下技术方案：一种栏目外框样式定义方法,包括以下步骤：
A、栏目外框样式组成；
B、样式模板文件定义；
C、目录结构定义。
优选的，所述步骤A中栏目外框样式主要由栏目边框样式、栏目头部样式、栏目内容样式组成；其中，栏目边框样式：A,B,C,D,E,F,G,H 8个区域使用到样式；栏目头部样式：栏目头图标、栏目头背景色、透明度、栏目标题的文字样式：字号、字体、颜色以及操作按钮图标；栏目内容样式：背景色、文字颜色、行分割线样式。
优选的，所述步骤B中portal/section/skin下的样式均使用sass编写，在1.scss、2.scss…12.scss这些文件中定义各种颜色变量；在allSectionElement.scss中定义各种栏目样式，包括面包屑、整个栏目、栏目标题区、栏目内容区、磁贴栏目、栏目底部区样式。
优选的，修改皮肤的正确操作为：先修改scss文件，并使用sass编译工具编译成对应的css文件，不允许直接修改css文件，因为修改模板的皮肤生成机制是读取这些scss中的数据，并生成新的css文件。
优选的，所述步骤C中栏目外框样式根目录包括栏目外框css文件、使用态栏目外框HTML文件、设计态栏目外框HTML文件。
优选的，所述栏目外框css文件包括定义各种栏目样式值、皮肤1、皮肤2、皮肤3、皮肤X，X为大于3的整数；每个皮肤中包括scss文件和css文件。
与现有技术相比，本发明的有益效果是：本发明中，栏目外框包括栏目外框样式组成、样式模板文件定义以及目录结构，其中，栏目外框样式主要由栏目边框样式、栏目头部样式、栏目内容样式组成。本发明支持可视化控制栏目的外框样式，同时能够统一控制门户中栏目的外框样式。
附图说明
图1为本发明栏目外框样式构成示意图；
图2为本发明目录结构示意图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
在本发明的描述中，需要说明的是，术语“上”、“下”、“内”、“外”“前端”、“后端”、“两端”、“一端”、“另一端”等指示的方位或位置关系为基于附图所示的方位或位置关系，仅是为了便于描述本发明和简化描述，而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本发明的限制。此外，术语“第一”、“第二”仅用于描述目的，而不能理解为指示或暗示相对重要性。
在本发明的描述中，需要说明的是，除非另有明确的规定和限定，术语“安装”、“设置有”、“连接”等，应做广义理解，例如“连接”，可以是固定连接，也可以是可拆卸连接，或一体地连接；可以是机械连接，也可以是电连接；可以是直接相连，也可以通过中间媒介间接相连，可以是两个元件内部的连通。对于本领域的普通技术人员而言，可以具体情况理解上述术语在本发明中的具体含义。
请参阅图1-2，本发明提供一种技术方案：一种栏目外框样式定义方法,包括以下步骤：
A、栏目外框样式组成；
B、样式模板文件定义；
C、目录结构定义。
本发明中，步骤A中栏目外框样式主要由栏目边框样式、栏目头部样式、栏目内容样式组成；其中，栏目边框样式：A,B,C,D,E,F,G,H 8个区域使用到样式；栏目头部样式：栏目头图标、栏目头背景色、透明度、栏目标题的文字样式：字号、字体、颜色以及操作按钮图标；栏目内容样式：背景色、文字颜色、行分割线样式。
本发明中，步骤B中portal/section/skin下的样式均使用sass编写，在1.scss、2.scss…12.scss这些文件中定义各种颜色变量；在allSectionElement.scss中定义各种栏目样式，包括面包屑、整个栏目、栏目标题区、栏目内容区、磁贴栏目、栏目底部区样式。
其中，修改皮肤的正确操作为：先修改scss文件，并使用sass编译工具编译成对应的css文件，不允许直接修改css文件，因为修改模板的皮肤生成机制是读取这些scss中的数据，并生成新的css文件。
本发明中，步骤C中栏目外框样式根目录包括栏目外框css文件、使用态栏目外框HTML文件、设计态栏目外框HTML文件。
本发明中，栏目外框css文件包括定义各种栏目样式值、皮肤1、皮肤2、皮肤3、皮肤X，X为大于3的整数；每个皮肤中包括scss文件和css文件。
综上所述，本发明中，栏目外框包括栏目外框样式组成、样式模板文件定义以及目录结构，其中，栏目外框样式主要由栏目边框样式、栏目头部样式、栏目内容样式组成。本发明支持可视化控制栏目的外框样式，同时能够统一控制门户中栏目的外框样式。
对于本领域技术人员而言，显然本发明不限于上述示范性实施例的细节，而且在不背离本发明的精神或基本特征的情况下，能够以其他的具体形式实现本发明。因此，无论从哪一点来看，均应将实施例看作是示范性的，而且是非限制性的，本发明的范围由所附权利要求而不是上述说明限定，因此旨在将落在权利要求的等同要件的含义和范围内的所有变化囊括在本发明内。不应将权利要求中的任何附图标记视为限制所涉及的权利要求。

Claims (6)

1.一种栏目外框样式定义方法,其特征在于：包括以下步骤：
A、栏目外框样式组成；
B、样式模板文件定义；
C、目录结构定义。
2.根据权利要求1所述的一种栏目外框样式定义方法，其特征在于：所述步骤A中栏目外框样式主要由栏目边框样式、栏目头部样式、栏目内容样式组成；其中，栏目边框样式：A,B,C,D,E,F,G,H 8个区域使用到样式；栏目头部样式：栏目头图标、栏目头背景色、透明度、栏目标题的文字样式：字号、字体、颜色以及操作按钮图标；栏目内容样式：背景色、文字颜色、行分割线样式。
3.根据权利要求1所述的一种栏目外框样式定义方法，其特征在于：所述步骤B中portal/section/skin下的样式均使用sass编写，在1.scss、2.scss…12.scss这些文件中定义各种颜色变量；在allSectionElement.scss中定义各种栏目样式，包括面包屑、整个栏目、栏目标题区、栏目内容区、磁贴栏目、栏目底部区样式。
4.根据权利要求3所述的一种栏目外框样式定义方法，其特征在于：修改皮肤的正确操作为：先修改scss文件，并使用sass编译工具编译成对应的css文件，不允许直接修改css文件，因为修改模板的皮肤生成机制是读取这些scss中的数据，并生成新的css文件。
5.根据权利要求1所述的一种栏目外框样式定义方法，其特征在于：所述步骤C中栏目外框样式根目录包括栏目外框css文件、使用态栏目外框HTML文件、设计态栏目外框HTML文件。
6.根据权利要求5所述的一种栏目外框样式定义方法，其特征在于：所述栏目外框css文件包括定义各种栏目样式值、皮肤1、皮肤2、皮肤3、皮肤X，X为大于3的整数；每个皮肤中包括scss文件和css文件。
CN202110721366.8A 2021-06-28 2021-06-28 一种栏目外框样式定义方法 Pending CN113420248A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110721366.8A CN113420248A (zh) 2021-06-28 2021-06-28 一种栏目外框样式定义方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110721366.8A CN113420248A (zh) 2021-06-28 2021-06-28 一种栏目外框样式定义方法

Publications (1)

Publication Number Publication Date
CN113420248A true CN113420248A (zh) 2021-09-21

Family

ID=77717799

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110721366.8A Pending CN113420248A (zh) 2021-06-28 2021-06-28 一种栏目外框样式定义方法

Country Status (1)

Country Link
CN (1) CN113420248A (zh)

Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100180194A1 (en) * 2009-01-14 2010-07-15 International Business Machines Corporation Method and apparatus for solving ui style conflicts in web application composition
CN107329747A (zh) * 2017-06-20 2017-11-07 福建中金在线信息科技有限公司 一种生成多主题样式的方法及装置
CN111507073A (zh) * 2020-04-10 2020-08-07 甯航 一种基于web富文本的论文编辑与智能排版方法及平台
CN112199094A (zh) * 2020-10-23 2021-01-08 瑞庭网络技术（上海）有限公司 信息展示方法、装置、电子设备和计算机可读介质
CN112817568A (zh) * 2021-02-02 2021-05-18 中国工商银行股份有限公司 微框架下的子应用样式设置方法及装置
CN112835576A (zh) * 2021-01-18 2021-05-25 北京致远互联软件股份有限公司 一种页面封装方法

Patent Citations (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100180194A1 (en) * 2009-01-14 2010-07-15 International Business Machines Corporation Method and apparatus for solving ui style conflicts in web application composition
CN107329747A (zh) * 2017-06-20 2017-11-07 福建中金在线信息科技有限公司 一种生成多主题样式的方法及装置
CN111507073A (zh) * 2020-04-10 2020-08-07 甯航 一种基于web富文本的论文编辑与智能排版方法及平台
CN112199094A (zh) * 2020-10-23 2021-01-08 瑞庭网络技术（上海）有限公司 信息展示方法、装置、电子设备和计算机可读介质
CN112835576A (zh) * 2021-01-18 2021-05-25 北京致远互联软件股份有限公司 一种页面封装方法
CN112817568A (zh) * 2021-02-02 2021-05-18 中国工商银行股份有限公司 微框架下的子应用样式设置方法及装置

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
李晶晶: "WEB2.0下富客户端框架的设计与实现", 《中国优秀博硕士学位论文全文数据库（硕士）信息科技辑》 *

Similar Documents

Publication Publication Date Title
US8327280B2 (en) Programmatic analysis of graphical sub-programs within a graphical program
US7246307B2 (en) Hierarchical drag and drop structure editor for web sites
US7650594B2 (en) Graphical program analyzer with framework for adding user-defined tests
US6249908B1 (en) System and method for representing graphical font data and for converting the font data to font instructions
US9552331B2 (en) Method and apparatus for implementing web pages having smart tables
US20080263101A1 (en) Data Processing Device and Data Processing Method
EP1669856A2 (en) Component-based software system
WO2006055720A1 (en) Dynamic generation of formatted user interfaces in software environments
CN110968294B (zh) 一种业务领域模型建立系统及方法
US20050268173A1 (en) Programmatically analyzing a graphical program by traversing objects in the graphical program
US20070258100A1 (en) Document Processing Device and Document Processing Method
US7805452B2 (en) Data processing device and data processing method
CN108415742A (zh) 分布式能源管理系统中模块化的界面配置方法及装置
EP2807542A1 (en) Graphical representation of an order of operations
Goldman et al. The ISI visual design editor generator
CN101236558A (zh) 一种基于web页的模拟IM客户端界面的方法和装置
CN112835576A (zh) 一种页面封装方法
CN113420248A (zh) 一种栏目外框样式定义方法
US20100077295A1 (en) Document processing device and document processing module
CN115904349A (zh) 一种基于vue模板的布局构建方法及系统
CN106599087B (zh) 一种空间信息服务的二次开发方法
WO2001082232A1 (en) Navigation links in generated documentation
Halewood et al. NSEDIT: A syntax‐directed editor and testing tool based on Nassi—Shneiderman charts
US20080040702A1 (en) Nonlinear workflow assembly for visual programming
US20080005154A1 (en) Document Processing Device and Document Processing Method

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
RJ01 Rejection of invention patent application after publication

Application publication date: 20210921

RJ01 Rejection of invention patent application after publication