CN115048602A - Style editing method and equipment, page display method and computer equipment - Google Patents
Style editing method and equipment, page display method and computer equipmentDownload PDFInfo
- Publication number
- CN115048602A CN115048602ACN202210719463.8ACN202210719463ACN115048602ACN 115048602 ACN115048602 ACN 115048602ACN 202210719463 ACN202210719463 ACN 202210719463ACN 115048602 ACN115048602 ACN 115048602A
- Authority
- CN
- China
- Prior art keywords
- class
- atomic
- css
- classes
- preset
- 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
Links
Images
Classifications
- G—PHYSICS
- G06—COMPUTING OR CALCULATING; 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 OR CALCULATING; COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/60—Software deployment
- G06F8/65—Updates
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)
- Computer Security & Cryptography (AREA)
- Stored Programmes (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
- Document Processing Apparatus (AREA)
Abstract
Description
Translated fromChinese技术领域technical field
本申请涉及计算机技术领域，尤其涉及一种样式编辑方法及其设备、页面显示方法以及计算机设备。The present application relates to the field of computer technology, and in particular, to a style editing method and its device, a page display method, and a computer device.
背景技术Background technique
CSS(Cascading Style Sheets，层叠样式表)是一种用于描述网页样式的计算机语言，开发人员可以通过编写CSS代码，以实现对网页样式的编辑。随着功能的加入、规模的增加，网页的CSS代码的代码冗余度往往也随之增加，导致CSS代码的运维成本上升。CSS (Cascading Style Sheets, Cascading Style Sheets) is a computer language used to describe the styles of web pages. Developers can edit the styles of web pages by writing CSS codes. With the addition of functions and the increase in scale, the code redundancy of the CSS code of the web page often increases, resulting in an increase in the operation and maintenance cost of the CSS code.
发明内容SUMMARY OF THE INVENTION
有鉴于此，实有必要提供一种样式编辑方法及其设备、页面显示方法以及计算机设备，能够有效减少CSS文件的代码量。In view of this, it is necessary to provide a style editing method and device, a page display method and a computer device, which can effectively reduce the code amount of CSS files.
第一方面，本申请实施例提供一种样式编辑方法，所述样式编辑方法包括：In a first aspect, an embodiment of the present application provides a style editing method, and the style editing method includes:
当利用开发工具创建HTML文件时，提供CSS声明模板，其中，所述CSS声明模板包括若干原子类以及每个原子类相关的预设CSS属性，所述CSS声明模板包含了所有预设CSS属性的原子类；所述若干原子类包括第一原子类集合和第二原子类集合，所述第一原子类集合中每一原子类相关的预设CSS属性为多条；所述第二原子类中每一原子类相关的预设CSS属性为一条；When an HTML file is created by using a development tool, a CSS declaration template is provided, wherein the CSS declaration template includes several atomic classes and preset CSS properties related to each atomic class, and the CSS declaration template includes all preset CSS properties. atomic classes; the several atomic classes include a first atomic class set and a second atomic class set, and there are multiple preset CSS properties related to each atomic class in the first atomic class set; in the second atomic class There is one preset CSS property related to each atomic class;
响应用户的输入触发生成HTML文件，其中，所述HTML文件中包含与页面的DOM元素相对应的标签，所述标签中的class值为所述若干原子类中一者的名称或者多者的名称组合；以及Triggering the generation of an HTML file in response to a user's input, wherein the HTML file contains tags corresponding to the DOM elements of the page, and the class value in the tags is the name of one or more of the several atomic classes combination; and
监听所述HTML文件并当监听到所述class值发生变化时，根据所述class值生成包含所述class值对应的原子类的样式表以作为所述HTML文件所引用的CSS声明文件。The HTML file is monitored and when a change in the class value is monitored, a style sheet including an atomic class corresponding to the class value is generated according to the class value as a CSS declaration file referenced by the HTML file.
第二方面，本申请实施例提供一种样式编辑设备，所述样式编辑设备包括：In a second aspect, an embodiment of the present application provides a style editing device, where the style editing device includes:
存储器，用于存储程序指令；以及memory for storing program instructions; and
处理器，用于执行所述程序指令以实现如上所述的样式编辑方法。A processor for executing the program instructions to implement the style editing method as described above.
第三方面，本申请实施例提供一种页面显示方法，所述页面显示方法包括：In a third aspect, an embodiment of the present application provides a method for displaying a page, and the method for displaying a page includes:
加载HTML文件，其中，所述HTML文件包含引用的CSS声明文件的名称；Loading an HTML file, wherein the HTML file contains the name of the referenced CSS declaration file;
根据所述CSS声明文件的名称获取CSS声明文件，其中，所述CSS声明文件包括若干原子类以及每个原子类相关的预设CSS属性，所述若干原子类包括第一原子类集合和第二原子类集合，所述第一原子类集合中每一原子类相关的预设CSS属性为多条；所述第二原子类中每一原子类相关的预设CSS属性为一条；Acquire a CSS declaration file according to the name of the CSS declaration file, wherein the CSS declaration file includes several atomic classes and preset CSS properties related to each atomic class, and the several atomic classes include a first atomic class set and a second atomic class set Atomic class set, there are multiple preset CSS properties related to each atomic class in the first atomic class set; there is one preset CSS attribute related to each atomic class in the second atomic class;
解析所述HTML文件各标签的class值得到相应的原子类，其中，所述class值为所述若干原子类中一者的名称或者多者的名称组合，所述HTML文件的标签对应目标页面的DOM元素；Parse the class value of each tag of the HTML file to obtain the corresponding atomic class, wherein the class value is the name of one of the several atomic classes or a combination of the names of more than one, and the label of the HTML file corresponds to the target page. DOM element;
根据解析出的原子类名称或者原子类名称组合从所述CSS声明文件中调用相对应的原子类对所对应的DOM元素进行编辑；以及Edit the corresponding DOM element by calling the corresponding atomic class from the CSS declaration file according to the parsed atomic class name or the atomic class name combination; and
显示所述目标页面。The target page is displayed.
第四方面，本申请实施例提供一种计算机设备，所述计算机设备包括：In a fourth aspect, an embodiment of the present application provides a computer device, where the computer device includes:
存储器，用于存储程序指令；以及memory for storing program instructions; and
处理器，用于执行所述程序指令以实现如上所述的页面显示方法。The processor is configured to execute the program instructions to implement the above-mentioned page display method.
上述样式编辑方法及其设备、页面显示方法以及计算机设备，开发人员可以对所有预设CSS属性的属性值进行判断，根据属性值是否为数值型将预设CSS属性划分为两类，并根据划分好的预设CSS属性形成CSS声明模板。其中，由于数值型属性值的预设CSS属性的数量较多，因此，将属性值连续的多个预设CSS属性与同一原子类相关联。通过原子类实现具有数值的样式指令，能够有效减少数值型属性值的预设CSS属性的数量。同时，将非数值型属性值的预设CSS属性与原子类一一对应关联，原子类的名称为相应预设CSS属性的属性值，能够极大降低CSS声明模板的代码的复杂度，使得CSS声明模板的代码为有限原子类的集合，并降低CSS声明模板的代码的运维成本，有效提升CSS声明模板的代码的可维护性。In the above-mentioned style editing method and device, page display method and computer device, developers can judge the attribute values of all preset CSS attributes, divide preset CSS attributes into two categories according to whether the attribute values are numeric values, and divide the preset CSS attributes according to the classification. Good preset CSS properties form CSS declaration templates. Wherein, since the number of preset CSS properties with numerical property values is large, multiple preset CSS properties with continuous property values are associated with the same atomic class. Implementing style instructions with numerical values through atomic classes can effectively reduce the number of preset CSS attributes with numerical attribute values. At the same time, the preset CSS properties of non-numeric property values are associated with atomic classes one by one, and the name of the atomic class is the property value of the corresponding preset CSS property, which can greatly reduce the complexity of the code of the CSS declaration template, making CSS The code of the declaration template is a collection of limited atomic classes, and the operation and maintenance cost of the code of the CSS declaration template is reduced, and the maintainability of the code of the CSS declaration template is effectively improved.
开发人员参照自定义的原子类编写HTML文件，由于所有预设CSS属性的原子类都自定义好了，且原子类具有统一性，能够形成统一的书写规范，从而能够简便、易行、快速地编写样式。同时，也不会出现同样的预设CSS属性在CSS声明模板中重复声明，因此能够有效避免多人协作开发样式时发生样式冲突，从而提高网页页面的开发速度，保持页面设计的一致性。当增加页面效果的复杂程度时，CSS声明模板的代码量都会保持在较小的体积下，不会急剧增多，也能够加快网页页面的渲染速度。当页面越复杂时，效果越明显。Developers write HTML files with reference to the custom atomic classes. Since all atomic classes with preset CSS properties are customized, and the atomic classes are unified, they can form a unified writing specification, which can be simple, easy, and fast. Writing style. At the same time, the same preset CSS properties will not be repeatedly declared in the CSS declaration template, so it can effectively avoid style conflicts when multiple people collaborate to develop styles, thereby improving the development speed of web pages and maintaining the consistency of page design. When the complexity of the page effect is increased, the code amount of the CSS declaration template will be kept at a small size without a sharp increase, and the rendering speed of the web page can also be accelerated. When the page is more complex, the effect is more obvious.
由于不是每个HTML文件都需要用到CSS声明模板中声明的所有原子类，因此，监听HTML文件中的class值并生成相应的CSS声明文件，可以极大减少CSS声明文件中声明的原子类的数量，从而形成一份数量极其有限的CSS声明文件，有效提升CSS声明文件代码的可维护性，降低CSS声明文件代码的运维成本。同时，当HTML文件中的原子类发生增加、修改、删除等变化时，能够自动更新CSS声明文件，而不需要修改CSS声明模板，从而降低CSS声明模板代码的复杂度。Since not every HTML file needs to use all the atomic classes declared in the CSS declaration template, monitoring the class value in the HTML file and generating the corresponding CSS declaration file can greatly reduce the number of atomic classes declared in the CSS declaration file. Therefore, an extremely limited number of CSS declaration files are formed, which effectively improves the maintainability of the CSS declaration file code and reduces the operation and maintenance cost of the CSS declaration file code. At the same time, when the atomic classes in the HTML file are added, modified, deleted, etc., the CSS declaration file can be automatically updated without modifying the CSS declaration template, thereby reducing the complexity of the CSS declaration template code.
附图说明Description of drawings
为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图示出的结构获得其他的附图。In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the following briefly introduces the accompanying drawings required for the description of the embodiments or the prior art. Obviously, the drawings in the following description are only These are some embodiments of the present application. For those of ordinary skill in the art, other drawings can also be obtained according to the structures shown in these drawings without any creative effort.
图1为本申请实施例提供的样式编辑方法的流程图。FIG. 1 is a flowchart of a style editing method provided by an embodiment of the present application.
图2为本申请实施例提供的样式编辑系统的内部结构示意图。FIG. 2 is a schematic diagram of an internal structure of a style editing system provided by an embodiment of the present application.
图3为本申请实施例提供的页面显示方法的流程图。FIG. 3 is a flowchart of a page display method provided by an embodiment of the present application.
图4为本申请实施例提供的计算机设备的内部结构示意图。FIG. 4 is a schematic diagram of an internal structure of a computer device provided by an embodiment of the present application.
本申请目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。The realization, functional characteristics and advantages of the purpose of the present application will be further described with reference to the accompanying drawings in conjunction with the embodiments.
具体实施方式Detailed ways
为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本申请，并不用于限定本申请。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。In order to make the purpose, technical solutions and advantages of the present application more clearly understood, the present application will be described in further detail below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application, but not to limit the present application. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative efforts shall fall within the protection scope of the present application.
本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“第三”、“第四”等(如果存在)是用于区别类似的规划对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，换句话说，描述的实施例根据除了这里图示或描述的内容以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，还可以包含其他内容，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于只清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。The terms "first", "second", "third", "fourth", etc. (if any) in the description and claims of the present application and the above-mentioned drawings are used to distinguish similar planning objects and do not necessarily Used to describe a specific order or sequence. It is to be understood that the data so used are interchangeable under appropriate circumstances, in other words, the described embodiments are implemented in accordance with sequences other than those illustrated or described herein. Furthermore, the terms "comprising" and "having" and any variations thereof may also encompass other content, for example, a process, method, system, product or device comprising a series of steps or units is not necessarily limited to only those expressly listed steps or units, but may include other steps or units not expressly listed or inherent to these processes, methods, products or devices.
需要说明的是，在本申请中涉及“第一”、“第二”等的描述仅用于描述目的，而不能理解为指示或暗示其相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”的特征可以明示或者隐含地包括一个或者多个该特征。另外，各个实施例之间的技术方案可以相互结合，但是必须是以本领域普通技术人员能够实现为基础，当技术方案的结合出现相互矛盾或无法实现时应当认为这种技术方案的结合不存在，也不在本申请要求的保护范围之内。It should be noted that the descriptions involving "first", "second", etc. in this application are only for the purpose of description, and should not be construed as indicating or implying their relative importance or implying the number of indicated technical features . Thus, a feature defined as "first" or "second" may expressly or implicitly include one or more of that feature. In addition, the technical solutions between the various embodiments can be combined with each other, but must be based on the realization by those of ordinary skill in the art. When the combination of technical solutions is contradictory or cannot be realized, it should be considered that the combination of such technical solutions does not exist. , is not within the scope of protection claimed in this application.
请结合参看图1，其为本申请实施例提供的样式编辑方法的流程图。当前端页面开发人员创建用于对页面进行样式编辑的HTML文件时，样式编辑方法利用开发工具对HTML文件进行监听，并生成相应的CSS声明文件。样式编辑方法具体包括如下步骤。Please refer to FIG. 1 , which is a flowchart of a style editing method provided by an embodiment of the present application. When the front-end page developer creates an HTML file for style editing of the page, the style editing method uses the development tool to monitor the HTML file, and generates a corresponding CSS declaration file. The style editing method specifically includes the following steps.
步骤S102，当利用开发工具创建HTML文件时，提供CSS声明模板。当开发人员利用开发工具创建HTML文件时，开发工具提供CSS声明模板。其中，CSS声明模板为预先设定好的模板文件。CSS声明模板包括若干原子类以及每个原子类相关的预设CSS属性。CSS声明模板包含了所有预设CSS属性的原子类。开发人员可以参照CSS声明模板中的原子类，对HTML文件进行编辑。In step S102, when an HTML file is created using a development tool, a CSS declaration template is provided. When developers use the development tools to create HTML files, the development tools provide CSS declaration templates. The CSS declaration template is a preset template file. The CSS declaration template includes several atomic classes and preset CSS properties associated with each atomic class. The CSS declaration template contains atomic classes for all preset CSS properties. Developers can edit HTML files by referring to the atomic classes in the CSS declaration template.
预设CSS属性为现有层叠样式表(Cascading Style Sheets，CSS)囊括的所有属性。在本实施例中，从实现效果的角度预先将所有属性划分为若干大类。其中，实现效果的角度包括但不限于实现布局、实现文本渲染等角度。大类包括但不限于布局(Layout)、弹性盒子和网格(Flexbox and Grid)、间距(Spacing)、大小(Sizing)、版面设计(Typography)、背景(Backgrounds)、边框(Borders)、效果(Effects)、滤镜(Filters)、表格(Tables)、变换(Transforms)、过渡和动画(Transitions and Animations)、交互(Interactivity)等。其中，每一预设CSS属性与一个大类相对应。即是说，所有大类包括的所有预设CSS属性覆盖现有层叠样式表囊括的所有属性。The default CSS properties are all properties included in the existing Cascading Style Sheets (CSS). In this embodiment, all attributes are pre-divided into several categories from the perspective of achieving effects. The angle of realizing the effect includes, but is not limited to, the angle of realizing layout, realizing text rendering, and the like. Major categories include but are not limited to Layout, Flexbox and Grid, Spacing, Sizing, Typography, Backgrounds, Borders, Effects ( Effects), Filters, Tables, Transforms, Transitions and Animations, Interactivity, etc. Among them, each preset CSS property corresponds to a large class. That is, all preset CSS properties included in all major classes override all properties included in existing Cascading Style Sheets.
预设CSS属性包括属性值，属性值用于表示预设CSS属性的效果。所有预设CSS属性中，部分预设CSS属性的属性值采用数值的形式进行表示，即属性值为数值型；部分预设CSS属性的属性值采用文字的形式进行表示，即属性值为非数值型。The preset CSS property includes a property value, and the property value is used to represent the effect of the preset CSS property. Among all the preset CSS properties, the property values of some preset CSS properties are represented in the form of numerical values, that is, the property values are numeric; the property values of some preset CSS properties are represented in the form of text, that is, the property values are non-numeric values type.
举例来说，用于表示文本对齐(text-align)的预设CSS属性包括四个，四个预设CSS属性的属性值分别为：左对齐(left)、居中对齐(center)、右对齐(right)、两端对齐(justified)。相应地，预设CSS属性分别为text-align-left、text-align-center、text-align-right、text-align-justified。用于表示行距(leading)的预设CSS属性包括若干个，预设CSS属性的属性值以像素的形式进行表示，若干个预设CSS属性的属性值包括多个，如8PX、12PX、15PX等。相应地，预设CSS属性分别为leading-8PX、leading-12PX、leading-15PX。因此，用于表示文本对齐的预设CSS属性的属性值为数值型，用于表示行距的预设CSS属性的属性值为非数值型。For example, the preset CSS properties used to indicate text alignment (text-align) include four, and the property values of the four preset CSS properties are: left alignment (left), center alignment (center), right alignment ( right), justified. Correspondingly, the preset CSS properties are text-align-left, text-align-center, text-align-right, and text-align-justified. There are several preset CSS properties used to represent leading, and the property values of the preset CSS properties are represented in the form of pixels. The property values of several preset CSS properties include multiple ones, such as 8PX, 12PX, 15PX, etc. . Correspondingly, the preset CSS properties are leading-8PX, leading-12PX, and leading-15PX respectively. Therefore, the property value of the preset CSS property used to represent the text alignment is a numeric type, and the property value of the preset CSS property used to represent the line spacing is a non-numeric type.
若干原子类包括第一原子类集合和第二原子类集合，第一原子类集合中每一原子类相关的预设CSS属性为多条，第二原子类中每一原子类相关的预设CSS属性为一条。具体地，第一原子类集合中的每一原子类相关的预设CSS属性的属性值为数值型。第二原子类集合中的每一原子类相关的预设CSS属性的属性值为非数值型。The plurality of atomic classes include a first atomic class set and a second atomic class set, the preset CSS properties related to each atomic class in the first atomic class set are multiple, and the preset CSS properties related to each atomic class in the second atomic class attribute is one. Specifically, the attribute value of the preset CSS attribute related to each atomic class in the first atomic class set is a numeric value. The attribute value of the preset CSS attribute related to each atomic class in the second atomic class set is non-numeric.
可以理解的是，预先设定CSS声明模板时，可以根据预设CSS属性的属性值对预设CSS属性进行分类，并自定义用于表示样式的原子类。当预设CSS属性的属性值为数值型时，将属性值连续的多个预设CSS属性与同一原子类相关联；当预设CSS属性的属性值不是数值型时，将一个预设CSS属性与一个原子类一一关联。It can be understood that, when the CSS declaration template is preset, the preset CSS attributes can be classified according to the attribute values of the preset CSS attributes, and the atomic classes used to represent the styles can be customized. When the property value of the preset CSS property is numeric, associate multiple preset CSS properties with consecutive property values with the same atomic class; when the property value of the preset CSS property is not numeric, associate a preset CSS property with the same atomic class One-to-one association with an atomic class.
举例来说，用于表示文本对齐(text-align)的预设CSS属性的属性值为非数值型，将每一预设CSS属性均与一个原子类相关联，则用于表示文本对齐的原子类包括四个，分别对应的预设CSS属性为：text-align-left、text-align-center、text-align-right、text-align-justified。For example, the property value of the default CSS property used to indicate text-align (text-align) is non-numeric, and each default CSS property is associated with an atom class, the atom used to indicate text alignment There are four classes, and the corresponding preset CSS properties are: text-align-left, text-align-center, text-align-right, and text-align-justified.
当预设CSS属性的属性值为数值型时，用于表示同一样式的预设CSS属性的数量较多，若直接将每一预设CSS属性均与一个原子类相关联，则会导致原子类的数量较多，不利于降低CSS声明模板的代码量。因此，将属性值连续的多个预设CSS属性与同一原子类相关联。其中，预设像素值可以为4PX。举例来说，用于表示行距(leading)的预设CSS属性的属性值以像素的形式进行表示，属性值分别与0PX至任意数值相对应。若预设像素值为4PX，则将属性值连续的四个预设CSS属性与同一原子类相关联。即，将leading-0PX、leading-1PX、leading-2PX以及leading-3PX四个预设CSS属性与同一原子类相关联；将leading-4PX、leading-5PX、leading-6PX以及leading-7PX四个预设CSS属性与同一原子类相关联；将leading-8PX、leading-9PX、leading-10PX以及leading-11PX四个预设CSS属性与同一原子类相关联，并以此类推将预设CSS属性与原子类进行关联。When the attribute value of the preset CSS attribute is numeric, the number of preset CSS attributes used to represent the same style is large. If each preset CSS attribute is directly associated with an atomic class, it will result in an atomic class A large number of , which is not conducive to reducing the code amount of CSS declaration templates. Therefore, multiple preset CSS properties with consecutive property values are associated with the same atomic class. The preset pixel value may be 4PX. For example, the property value of the preset CSS property for representing leading is represented in the form of pixels, and the property value corresponds to 0PX to any numerical value, respectively. If the preset pixel value is 4PX, then four preset CSS properties with consecutive property values are associated with the same atomic class. That is, the four preset CSS properties of leading-0PX, leading-1PX, leading-2PX and leading-3PX are associated with the same atomic class; the four preset CSS properties of leading-4PX, leading-5PX, leading-6PX and leading-7PX are Set CSS properties to be associated with the same atomic class; associate the four preset CSS properties of leading-8PX, leading-9PX, leading-10PX and leading-11PX with the same atomic class, and so on to associate the default CSS properties with the atomic class Classes are associated.
在一些可行的实施例中，预设像素值可以为3PX、5PX或者其它数值，预设像素值也可以根据实际情况进行设置，在此不做限定。In some feasible embodiments, the preset pixel value may be 3PX, 5PX or other values, and the preset pixel value may also be set according to the actual situation, which is not limited herein.
在另一些可行的实施例中，若数值型属性值以其它形式进行表示时，可以按照其它形式的预设值将属性值连续的多个预设CSS属性与同一原子类相关联。In some other feasible embodiments, if the numerical attribute value is represented in other forms, a plurality of preset CSS attributes with consecutive attribute values may be associated with the same atomic class according to the preset value of the other form.
在本实施例中，第一原子类集合中的原子类包括若干子原子类集合，若干子原子类集合中的每个原子类的名称包括标识字段和等级字段。第二原子类集合中的每一原子类的名称仅包括标识字段。其中，一部分若干原子类的标识字段用相关的预设CSS属性的名称表示，等级字段对应相关的预设CSS属性的属性值范围；另一部分若干原子类的标识字段用相关的预设CSS属性的属性值表示。即是说，子原子类集合中的原子类名称的标识字段用相关的预设CSS属性的名称表示，等级字段对应相关的预设CSS属性的属性值范围。第二原子类集合中的每一原子类名称的标识字段用相关的预设CSS属性的属性值表示。In this embodiment, the atomic classes in the first atomic class set include several sub-atomic class sets, and the name of each atomic class in the several sub-atomic class sets includes an identification field and a level field. The name of each atomic class in the second set of atomic classes includes only the identification field. Among them, the identification fields of some atomic classes are represented by the names of the relevant preset CSS properties, and the level fields correspond to the attribute value ranges of the relevant preset CSS properties; the identification fields of the other part of the atomic classes are represented by the names of the relevant preset CSS properties. Property value representation. That is to say, the identification field of the atomic class name in the sub-atomic class set is represented by the name of the relevant preset CSS attribute, and the level field corresponds to the attribute value range of the relevant preset CSS attribute. The identification field of each atomic class name in the second atomic class set is represented by the attribute value of the relevant preset CSS attribute.
举例来说，第一原子类集合中的某一子原子类集合中，原子类的名称分别为leading-1、leading-2、leading-3。其中，leading为标识字段，1、2、3为等级字段。可以理解的是，同一子原子类集合中所有原子类的标识字段相同，原子类的名称采用键值对的方式表示。相应地，与该子原子类集合中所有原子类相关的预设CSS属性用于表示行距(leading)。用于表示行距(leading)的预设CSS属性包括leading-0PX、leading-1PX、leading-2PX、leading-3PX、leading-4PX、leading-5PX、leading-6PX、leading-7PX、leading-8PX、leading-9PX、leading-10PX以及leading-11PX。其中，预设CSS属性的名称均为leading，属性值范围包括0-3PX、4-7PX、8-11PX。可以理解的是，等级字段1与属性值范围0-3PX相对应，等级字段2与属性值范围4-7PX相对应，等级字段3与属性值范围8-11PX相对应。For example, in a certain sub-atomic class set in the first atomic class set, the names of the atomic classes are leading-1, leading-2, and leading-3, respectively. Among them, leading is the identification field, and 1, 2, and 3 are the level fields. It can be understood that the identification fields of all atomic classes in the same sub-atomic class set are the same, and the names of atomic classes are represented in the form of key-value pairs. Accordingly, the preset CSS properties associated with all atomic classes in the sub-atomic class set are used to indicate leading. Preset CSS properties for leading are leading-0PX, leading-1PX, leading-2PX, leading-3PX, leading-4PX, leading-5PX, leading-6PX, leading-7PX, leading-8PX, leading -9PX, leading-10PX and leading-11PX. Among them, the names of the preset CSS properties are all leading, and the property value ranges include 0-3PX, 4-7PX, and 8-11PX. It can be understood that the level field 1 corresponds to the attribute value range 0-3PX, the level field 2 corresponds to the attribute value range 4-7PX, and the level field 3 corresponds to the attribute value range 8-11PX.
举例来说，第二原子类集合中某些原子类的名称分别为left、center、right、justified。其中，标识字段包括left、center、right、justified。即是说，原子类的标识字段用表示文本对齐(text-align)的预设CSS属性的属性值表示。For example, the names of some atomic classes in the second atomic class set are left, center, right, and justified, respectively. Among them, the identification field includes left, center, right, justified. That is, the identification field of the atomic class is represented by a property value of a preset CSS property representing text-align.
在本实施例中，若干原子类中每个原子类相关的预设CSS属性是固定的。In this embodiment, the preset CSS properties related to each atomic class among several atomic classes are fixed.
步骤S104，响应用户的输入触发生成HTML文件。其中，HTML文件中包含与页面的DOM(文件对象模型，Document Object Model)元素相对应的标签。HTML文件通过标签定义class的值。标签中的class值为若干原子类中一者的名称或者多者的名称组合。Step S104, triggering the generation of an HTML file in response to a user's input. The HTML file includes tags corresponding to DOM (Document Object Model, Document Object Model) elements of the page. The HTML file defines the value of the class through tags. The class value in the tag is the name of one of several atomic classes or a combination of names.
开发人员可以根据实际页面版式需求直接参照CSS声明模板中的原子类在HTML文件中输入相应的原子类。可以理解的是，一旦CSS声明模板中的原子类自定义好之后，所有的开发人员都可以直接参照自定义好的原子类编辑HTML文件，无需每次在编辑HTML文件之前都重复对预设CSS属性对应的原子类进行自定义。Developers can directly refer to the atomic classes in the CSS declaration template and enter the corresponding atomic classes in the HTML file according to the actual page layout requirements. Understandably, once the atomic class in the CSS declaration template is customized, all developers can directly refer to the customized atomic class to edit the HTML file without repeating the preset CSS every time before editing the HTML file. The atomic class corresponding to the attribute can be customized.
举例来说，开发人员在HTML文件中输入的语句为：<p class＝"left">SoIstarted to walk into the water...</p>。其中，<p>为与DOM元素相对应的标签，标签中class值为left，即class值为一个原子类的名称。For example, the statement entered by the developer in the HTML file is: <p class="left">SoIstarted to walk into the water...</p>. Among them, <p> is the label corresponding to the DOM element, and the class value in the label is left, that is, the class value is the name of an atomic class.
步骤S106，监听HTML文件并当监听到class值发生变化时，根据class值生成包含class值对应的原子类的样式表以作为HTML文件所引用的CSS声明文件。可以理解的是，CSS声明文件中的原子类为HTML文件中包含的原子类。即，CSS声明文件中的原子类与HTML文件包含的原子类相对应。在本实施例中，监听每一HTML文件，并为每一HTML文件都生成对应的CSS声明文件，即，每一HTML文件均对应一个CSS声明文件。其中，CSS声明文件中原子类的数量少于CSS声明模板中原子类的数量。Step S106, monitor the HTML file and when the change of the class value is monitored, generate a style sheet including the atomic class corresponding to the class value according to the class value as the CSS declaration file referenced by the HTML file. It can be understood that the atomic classes in the CSS declaration file are the atomic classes contained in the HTML file. That is, the atomic classes in the CSS declaration file correspond to the atomic classes contained in the HTML file. In this embodiment, each HTML file is monitored, and a corresponding CSS declaration file is generated for each HTML file, that is, each HTML file corresponds to a CSS declaration file. Among them, the number of atomic classes in the CSS declaration file is less than the number of atomic classes in the CSS declaration template.
在本实施例中，class值的变化包括但不限于增加、修改、删除等。举例来说，HTML文件中原有的语句为：<div class＝"shadow-smbg-white rounded-lg">shadow-sm</div>。该HTML文件通过<div>标签定义class值为shadow-sm、bg-white、rounded-lg，即class值为三个原子类的名称组合。则页面中相应生成的DOM元素包括背景白色、圆角、边缘带阴影的边框。当需要替换背景色时，开发人员只需要把HTML文件中的bg-white修改为对应的背景色即可。如，将背景色修改为红色，则将bg-white修改为bg-red。当需要加重阴影效果时，开发人员只需要将shadow-sm调整为shadow-lg。当不需要圆角效果时，开发人员只需要删除rounded-lg即可。上述操作都将改变class值，则CSS声明文件中的原子类也会相应改变。In this embodiment, the change of the class value includes, but is not limited to, addition, modification, deletion, and the like. For example, the original statement in the HTML file is: <div class="shadow-smbg-white rounded-lg">shadow-sm</div>. The HTML file defines the class value as shadow-sm, bg-white, and rounded-lg through the <div> tag, that is, the class value is the combination of the names of the three atomic classes. The corresponding generated DOM elements in the page include a white background, rounded corners, and borders with shadows on the edges. When the background color needs to be replaced, the developer only needs to modify the bg-white in the HTML file to the corresponding background color. For example, to change the background color to red, change bg-white to bg-red. Developers only need to adjust shadow-sm to shadow-lg when they need to accentuate the shadow effect. When the rounded corner effect is not needed, developers just need to remove rounded-lg. The above operations will change the class value, and the atomic class in the CSS declaration file will also change accordingly.
上述实施例中，开发人员可以对所有预设CSS属性的属性值进行判断，根据属性值是否为数值型将预设CSS属性划分为两类，并根据划分好的预设CSS属性形成CSS声明模板。其中，由于数值型属性值的预设CSS属性的数量较多，因此，将属性值连续的多个预设CSS属性与同一原子类相关联。通过原子类实现具有数值的样式指令，能够有效减少数值型属性值的预设CSS属性的数量。同时，将非数值型属性值的预设CSS属性与原子类一一对应关联，原子类的名称为相应预设CSS属性的属性值，能够极大降低CSS声明模板的代码的复杂度，使得CSS声明模板的代码为有限原子类的集合，并降低CSS声明模板的代码的运维成本，有效提升CSS声明模板的代码的可维护性。In the above embodiment, the developer can judge the attribute values of all the preset CSS attributes, divide the preset CSS attributes into two categories according to whether the attribute values are numerical, and form a CSS declaration template according to the divided preset CSS attributes. . Wherein, since the number of preset CSS properties with numerical property values is large, multiple preset CSS properties with continuous property values are associated with the same atomic class. Implementing style instructions with numerical values through atomic classes can effectively reduce the number of preset CSS attributes with numerical attribute values. At the same time, the preset CSS properties of non-numeric property values are associated with atomic classes one by one, and the name of the atomic class is the property value of the corresponding preset CSS property, which can greatly reduce the complexity of the code of the CSS declaration template, making CSS The code of the declaration template is a collection of limited atomic classes, and the operation and maintenance cost of the code of the CSS declaration template is reduced, and the maintainability of the code of the CSS declaration template is effectively improved.
开发人员参照自定义的原子类编写HTML文件，由于所有预设CSS属性的原子类都自定义好了，且原子类具有统一性，能够形成统一的书写规范，从而能够简便、易行、快速地编写样式。同时，也不会出现同样的预设CSS属性在CSS声明模板中重复声明，因此能够有效避免多人协作开发样式时发生样式冲突，从而提高网页页面的开发速度，保持页面设计的一致性。当增加页面效果的复杂程度时，CSS声明模板的代码量都会保持在较小的体积下，不会急剧增多，也能够加快网页页面的渲染速度。当页面越复杂时，效果越明显。Developers write HTML files with reference to the custom atomic classes. Since all atomic classes with preset CSS properties are customized, and the atomic classes are unified, they can form a unified writing specification, which can be simple, easy, and fast. Writing style. At the same time, the same preset CSS properties will not be repeatedly declared in the CSS declaration template, so it can effectively avoid style conflicts when multiple people collaborate to develop styles, thereby improving the development speed of web pages and maintaining the consistency of page design. When the complexity of the page effect is increased, the code amount of the CSS declaration template will be kept at a small size without a sharp increase, and the rendering speed of the web page can also be accelerated. When the page is more complex, the effect is more obvious.
由于不是每个HTML文件都需要用到CSS声明模板中声明的所有原子类，因此，监听HTML文件中的class值并生成相应的CSS声明文件，可以极大减少CSS声明文件中声明的原子类的数量，从而形成一份数量极其有限的CSS声明文件，有效提升CSS声明文件代码的可维护性，降低CSS声明文件代码的运维成本。同时，当HTML文件中的原子类发生增加、修改、删除等变化时，能够自动更新CSS声明文件，而不需要修改CSS声明模板，从而降低CSS声明模板代码的复杂度。Since not every HTML file needs to use all the atomic classes declared in the CSS declaration template, monitoring the class value in the HTML file and generating the corresponding CSS declaration file can greatly reduce the number of atomic classes declared in the CSS declaration file. Therefore, an extremely limited number of CSS declaration files are formed, which effectively improves the maintainability of the CSS declaration file code and reduces the operation and maintenance cost of the CSS declaration file code. At the same time, when the atomic classes in the HTML file are added, modified, deleted, etc., the CSS declaration file can be automatically updated without modifying the CSS declaration template, thereby reducing the complexity of the CSS declaration template code.
请结合参看图2，其为本申请实施例提供的样式编辑系统的内部结构示意图。样式编辑系统20包括存储器21和处理器22。存储器21用于存储程序指令，处理器22用于执行程序指令以实现上述样式编辑方法。Please refer to FIG. 2 , which is a schematic diagram of the internal structure of the style editing system provided by the embodiment of the present application. The
其中，处理器22在一些实施例中可以是一中央处理器(Central ProcessingUnit，CPU)、控制器、微控制器、微处理器或其它数据处理芯片，用于运行存储器21中存储的程序指令。The
存储器21至少包括一种类型的可读存储介质，该可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如，SD或DX存储器等)、磁性存储器、磁盘、光盘等。存储器21在一些实施例中可以是计算机设备的内部存储单元，例如计算机设备的硬盘。存储器21在另一些实施例中也可以是计算机设备的外部存储设备，例如计算机设备上配备的插接式硬盘、智能存储卡(Smart Media Card，SMC)、安全数字(Secure Digital，SD)卡、闪存卡(FlashCard)等。进一步地，存储器21还可以既包括计算机设备的内部存储单元也包括外部存储设备。存储器21不仅可以用于存储安装于计算机设备的应用软件及各类数据，例如实现样式编辑方法的代码等，还可以用于暂时地存储已经输出或者将要输出的数据。The
请结合参看图3，其为本申请实施例提供的页面显示方法的流程图。页面显示方法用于根据HTML文件生成相应的目标页面。页面显示方法具体包括如下步骤。Please refer to FIG. 3 , which is a flowchart of a page display method provided by an embodiment of the present application. The page display method is used to generate the corresponding target page according to the HTML file. The page display method specifically includes the following steps.
步骤S302，加载HTML文件。其中，HTML文件包含引用的CSS声明文件的名称。可以理解的是，HTML文件包含的引用的CSS声明文件为根据该HTML文件生成的声明文件。Step S302, load the HTML file. where the HTML file contains the name of the referenced CSS declaration file. It can be understood that the referenced CSS declaration file included in the HTML file is a declaration file generated according to the HTML file.
步骤S304，根据CSS声明文件的名称获取CSS声明文件。其中，CSS声明文件包括若干原子类以及每个原子类相关的预设CSS属性。若干原子类包括第一原子类集合和第二原子类集合，第一原子类集合中每一原子类相关的预设CSS属性为多条；第二原子类中每一原子类相关的预设CSS属性为一条。Step S304, acquiring the CSS declaration file according to the name of the CSS declaration file. The CSS declaration file includes several atomic classes and preset CSS properties related to each atomic class. The plurality of atomic classes includes a first atomic class set and a second atomic class set, and there are multiple preset CSS properties related to each atomic class in the first atomic class set; preset CSS properties related to each atomic class in the second atomic class attribute is one.
步骤S306，解析HTML文件各标签的class值得到相应的原子类。其中，class值为若干原子类中一者的名称或者多者的名称组合。HTML文件的标签对应目标页面的DOM元素。Step S306, parsing the class value of each tag of the HTML file to obtain the corresponding atomic class. Among them, the class value is the name of one of several atomic classes or the name combination of more than one. The tags of the HTML file correspond to the DOM elements of the target page.
步骤S308，根据解析出的原子类名称或者原子类名称组合从CSS声明文件中调用相对应的原子类对所对应的DOM元素进行编辑。Step S308 , according to the parsed atomic class name or the atomic class name combination, the corresponding atomic class is called from the CSS declaration file to edit the corresponding DOM element.
举例来说，若HTML文件中的语句包括：<p class＝"left">So I started to walkinto the water...</p>，则解析该语句的class值得到的原子类为left。从CSS声明文件中调用原子类left对标签<p>所对应的DOM元素进行编辑。DOM元素包括对齐方式为左对齐的文本：“So I started to walk into the water...”。For example, if the statement in the HTML file includes: <p class="left">So I started to walkinto the water...</p>, the atomic class obtained by parsing the class value of the statement is left. Call the atomic class left from the CSS declaration file to edit the DOM element corresponding to the tag <p>. The DOM element includes the text aligned to the left: "So I started to walk into the water...".
步骤S310，显示目标页面。其中，目标页面包括HTML文件中与所有标签一一对应的DOM元素。Step S310, displaying the target page. Wherein, the target page includes DOM elements in the HTML file that correspond to all tags one-to-one.
请结合参看图4，其为本申请实施例提供的计算机设备的内部结构示意图。计算机设备10包括存储器11和处理器12。存储器11用于存储程序指令，处理器12用于执行程序指令以实现上述页面显示方法。Please refer to FIG. 4 , which is a schematic diagram of an internal structure of a computer device according to an embodiment of the present application.
其中，处理器12在一些实施例中可以是一中央处理器(Central ProcessingUnit，CPU)、控制器、微控制器、微处理器或其它数据处理芯片，用于运行存储器11中存储的程序指令。The
存储器11至少包括一种类型的可读存储介质，该可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如，SD或DX存储器等)、磁性存储器、磁盘、光盘等。存储器11在一些实施例中可以是计算机设备的内部存储单元，例如计算机设备的硬盘。存储器11在另一些实施例中也可以是计算机设备的外部存储设备，例如计算机设备上配备的插接式硬盘、智能存储卡(Smart Media Card，SMC)、安全数字(Secure Digital，SD)卡、闪存卡(FlashCard)等。进一步地，存储器11还可以既包括计算机设备的内部存储单元也包括外部存储设备。存储器11不仅可以用于存储安装于计算机设备的应用软件及各类数据，例如实现页面显示方法的代码等，还可以用于暂时地存储已经输出或者将要输出的数据。The
显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样，倘且本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。Obviously, those skilled in the art can make various changes and modifications to the present application without departing from the spirit and scope of the present application. Thus, if these modifications and variations of the present application fall within the scope of the claims of the present application and their equivalents, the present application is also intended to include these modifications and variations.
以上所列举的仅为本申请较佳实施例而已，当然不能以此来限定本申请之权利范围，因此依本申请权利要求所作的等同变化，仍属于本申请所涵盖的范围。The above enumeration is only the preferred embodiment of the present application, of course, the scope of the right of the present application cannot be limited by this, so the equivalent changes made according to the claims of the present application still belong to the scope covered by the present application.
Claims (10)
Translated fromChinesePriority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202210719463.8ACN115048602A (en) | 2022-06-23 | 2022-06-23 | Style editing method and equipment, page display method and computer equipment |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202210719463.8ACN115048602A (en) | 2022-06-23 | 2022-06-23 | Style editing method and equipment, page display method and computer equipment |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN115048602Atrue CN115048602A (en) | 2022-09-13 |
Family
ID=83163500
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202210719463.8APendingCN115048602A (en) | 2022-06-23 | 2022-06-23 | Style editing method and equipment, page display method and computer equipment |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN115048602A (en) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115858983A (en)* | 2022-12-15 | 2023-03-28 | 上海众源网络有限公司 | Method and device for generating CSS file, electronic device and storage medium |
| CN116257714A (en)* | 2022-12-20 | 2023-06-13 | 网易（杭州）网络有限公司 | Method, device, computer equipment and storage medium for generating cascading style sheet |
Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103257986A (en)* | 2011-12-23 | 2013-08-21 | 软件股份公司 | Creating html/css representations of a geometric symbol |
| US8745027B1 (en)* | 2011-04-11 | 2014-06-03 | Google Inc. | Jslayout cascading style sheets optimization |
| CN104965866A (en)* | 2015-06-05 | 2015-10-07 | 小米科技有限责任公司 | Method and apparatus for establishing label and style rule binding relation |
| CN106503212A (en)* | 2016-10-27 | 2017-03-15 | 中企动力科技股份有限公司 | A kind of method to set up of web page element pattern and device |
| CN109445780A (en)* | 2018-09-19 | 2019-03-08 | 平安科技（深圳）有限公司 | A kind of pattern edit methods and equipment |
| CN111444456A (en)* | 2020-03-25 | 2020-07-24 | 北京奇艺世纪科技有限公司 | Method and device for editing style and electronic equipment |
| CN111723322A (en)* | 2020-05-15 | 2020-09-29 | 苏州浪潮智能科技有限公司 | A method for rendering cascading style sheets and related devices |
- 2022
- 2022-06-23CNCN202210719463.8Apatent/CN115048602A/enactivePending
Patent Citations (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US8745027B1 (en)* | 2011-04-11 | 2014-06-03 | Google Inc. | Jslayout cascading style sheets optimization |
| CN103257986A (en)* | 2011-12-23 | 2013-08-21 | 软件股份公司 | Creating html/css representations of a geometric symbol |
| CN104965866A (en)* | 2015-06-05 | 2015-10-07 | 小米科技有限责任公司 | Method and apparatus for establishing label and style rule binding relation |
| CN106503212A (en)* | 2016-10-27 | 2017-03-15 | 中企动力科技股份有限公司 | A kind of method to set up of web page element pattern and device |
| CN109445780A (en)* | 2018-09-19 | 2019-03-08 | 平安科技（深圳）有限公司 | A kind of pattern edit methods and equipment |
| CN111444456A (en)* | 2020-03-25 | 2020-07-24 | 北京奇艺世纪科技有限公司 | Method and device for editing style and electronic equipment |
| CN111723322A (en)* | 2020-05-15 | 2020-09-29 | 苏州浪潮智能科技有限公司 | A method for rendering cascading style sheets and related devices |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115858983A (en)* | 2022-12-15 | 2023-03-28 | 上海众源网络有限公司 | Method and device for generating CSS file, electronic device and storage medium |
| CN116257714A (en)* | 2022-12-20 | 2023-06-13 | 网易（杭州）网络有限公司 | Method, device, computer equipment and storage medium for generating cascading style sheet |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN100440222C (en) | System and method for text legibility enhancement | |
| US7673235B2 (en) | Method and apparatus for utilizing an object model to manage document parts for use in an electronic document | |
| US20040133854A1 (en) | Persistent document object model | |
| KR101312732B1 (en) | Methods and systems for providing direct style sheet editing | |
| CN104111922B (en) | Processing method and device of streaming document | |
| US10049095B2 (en) | In-context editing of output presentations via automatic pattern detection | |
| US7865481B2 (en) | Changing documents to include changes made to schemas | |
| US9208249B2 (en) | Profiler for page rendering | |
| CN115048602A (en) | Style editing method and equipment, page display method and computer equipment | |
| CN111752565A (en) | An interface generation method, apparatus, computer device and readable storage medium | |
| US20120278701A1 (en) | Automatically Generating And Porting A Cascading Style Sheets ('CSS') Style Sheet | |
| CN111797336A (en) | A web page parsing method, device, electronic device and medium | |
| US7337393B2 (en) | Methods and systems for providing an editable visual formatting model | |
| US7027071B2 (en) | Selecting elements from an electronic document | |
| CN112068826A (en) | Control method, system, electronic device and storage medium for text input | |
| CN114791989B (en) | A browser-based PSD file parsing method, system, and storage medium | |
| CN115659087B (en) | Page rendering method, equipment and storage medium | |
| CN111768823B (en) | SVG element-based medical expression editing method, device, equipment and medium | |
| CN110457659B (en) | Clause document generation method and terminal equipment | |
| CN113656431A (en) | A Graphic Display Method Based on Big Data | |
| US20070168857A1 (en) | Transformation of Source Data in a Source Markup Language to Target Data in a Target Markup Language | |
| CN108228115B (en) | A printing method and device for browser display page | |
| CN103455316A (en) | Class-based code generator | |
| JP7511341B2 (en) | Information processing system, control method for information processing system, and program | |
| CN118627475A (en) | A method, device, equipment and medium for displaying special characters |
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 |