Page description column width setting method and device, equipment and storage medium

Through precise calculation and judgment, adjusting the width of the page description column to adapt to the container space, the problem of insufficient space utilization in the prior art is solved, and a more reasonable page layout and visual effect is achieved.

CN120104023APending Publication Date: 2025-06-06BEIJING YOUTEJIE INFORMATION TECH
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202510175391.9
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-02-18
Publication Date
2025-06-06

AI Technical Summary

Technical Problem

The existing page description column width setting method cannot effectively utilize the page space, resulting in insufficient space utilization and affecting visual effects and user experience.

Method used

By obtaining the container width of the page to be displayed and the total width of the description column, determine the usage of the description column, and adjust the final description column width according to this situation to generate the final display page.

Benefits of technology

Ensure that the description column can make full use of the available space of the page container, reduce page whitespace, improve page space utilization, and improve overall visual effect.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120104023A_ABST
    Figure CN120104023A_ABST
Patent Text Reader

Abstract

The invention discloses a page description column width setting method and device, equipment and a storage medium. Comprising the steps that the container width of a to-be-displayed page is obtained, the total width of a to-be-displayed description column is determined, and the total width of the description column is the sum of the original width of a label column and the original width of a value column; determining the occupation condition of the description column according to the container width and the total width of the description column; and determining a final description column width according to the description column occupation condition, and generating a final display page based on the final description column width. Through accurate calculation and judgment, it is ensured that the description column can fully utilize the available space of the page container, the page blank space is reduced, and the page space utilization rate is increased. The optimal width is determined according to the container width and the actual condition of the description column, so that the page layout is more reasonable, and the overall visual effect is improved. The method can adapt to different page container widths and description column content lengths, the widths are flexibly adjusted, and it is guaranteed that a good display effect can be presented under various conditions.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of page display, and in particular to a method, device, equipment and storage medium for setting the width of a page description column. Background Art

[0002] In the field of page design and display, setting the width of the page description column has always been an important and challenging issue. Usually, we expect the description column in the page to be reasonably laid out and make full use of the page space to provide a clear and comfortable visual effect.

[0003] However, the existing method for setting the width of the page description column has many shortcomings. In the traditional way, the maximum or minimum width of the description column is set using Cascading Style Sheets (CSS). However, this method has obvious defects. When the value returned by a column exceeds or is less than the set maximum or minimum width, the other column cannot effectively use its unoccupied space, resulting in insufficient and unreasonable space utilization. Either the description column width is too large, exceeding the container range, affecting the overall layout of the page; or the description column width is too small, and the container space is not fully utilized, resulting in too much blank space on the page, affecting the visual effect and user experience. Summary of the invention

[0004] The present invention provides a method, device, equipment and storage medium for setting the width of a page description column, so that the description column can fully utilize the page space and avoid blank space.

[0005] According to one aspect of the present invention, a method for setting the width of a page description column is provided, the method comprising:

[0006] Get the container width of the page to be displayed, and determine the total width of the description column to be displayed, where the total width of the description column is the sum of the original width of the label column and the original width of the value column;

[0007] Determine the description column occupancy according to the container width and the total description column width, wherein the description column occupancy includes exceeding the container range and not exceeding the container range;

[0008] The final description column width is determined according to the description column occupancy, and the final display page is generated based on the final description column width, wherein the final description column width includes the final width of the label column and the final width of the value column.

[0009] Optionally, determining the description column occupancy according to the container width and the total description column width includes: judging whether the total description column width is greater than or equal to the container width, and if so, determining that the description column occupancy exceeds the container range; otherwise, determining that the description column occupancy does not exceed the container range.

[0010] Optionally, the final description column width is determined based on the description column occupancy, including: when the description column occupancy exceeds the container range, half of the container width is used as the target width; determine whether the original width of the label column and the original width of the value column are both greater than the target width, and if so, use the target width as the final width of the label column and the final width of the value column; otherwise, determine the final description column width based on the original width of the label column and the target width.

[0011] Optionally, the final description column width is determined according to the original width and the target width of the label column, including: determining whether the original width of the label column is smaller than the target width, if so, calculating a first difference between the container width and the original width of the label column, using the first difference as the final width of the value column, and directly using the original width of the label column as the final width of the label column; otherwise, calculating a second difference between the container width and the original width of the value column, using the second difference as the final width of the label column, and directly using the original width of the value column as the final width of the value column.

[0012] Optionally, the final description column width is determined based on the description column occupancy, including: when the description column occupancy does not exceed the container range, judging whether the original width of the label column is smaller than the original width of the value column; if so, directly using the original width of the label column as the final width of the label column, and calculating the third difference between the container width and the final width of the label column, and using the third difference as the final width of the value column; otherwise, directly using the original width of the value column as the final width of the value column, and calculating the fourth difference between the container width and the final width of the value column, and using the fourth difference as the final width of the label column.

[0013] Optionally, generating a final display page based on the final description column width includes: displaying the description column to be displayed based on the final description column width, and determining an excess portion of the description column to be displayed; and displaying the excess portion according to a preset style to generate the final display page.

[0014] Optionally, determining the excess portion of the description column to be displayed includes: determining the excess portion of the label column according to the original width of the label column and the final width of the label column; determining the excess portion of the value column according to the original width of the value column and the final width of the value column; and using the excess portion of the label column and the excess portion of the value column as the excess portion of the description column to be displayed.

[0015] According to another aspect of the present invention, there is provided a device for setting the width of a page description column, the device comprising:

[0016] A width acquisition module, used to acquire the container width of the page to be displayed, and determine the total width of the description column to be displayed, wherein the total width of the description column is the sum of the original width of the label column and the original width of the value column;

[0017] A description column occupancy determination module, used to determine the description column occupancy according to the container width and the total description column width, wherein the description column occupancy includes exceeding the container range and not exceeding the container range;

[0018] The final display page generation module is used to determine the final description column width according to the description column occupancy, and generate the final display page based on the final description column width, wherein the final description column width includes the final width of the label column and the final width of the value column.

[0019] According to another aspect of the present invention, an electronic device is provided, the electronic device comprising:

[0020] at least one processor;

[0021] and a memory communicatively coupled to the at least one processor;

[0022] The memory stores a computer program executable by the at least one processor, and the computer program is executed by the at least one processor so that the at least one processor can execute a method for setting a page description column width as described in any embodiment of the present invention.

[0023] According to another aspect of the present invention, a computer-readable storage medium is provided, wherein the computer-readable storage medium stores computer instructions, wherein the computer instructions are used to enable a processor to implement a method for setting a page description column width as described in any embodiment of the present invention when executed.

[0024] The technical solution of the embodiment of the present invention ensures that the description column can make full use of the available space of the page container through precise calculation and judgment, reduces page blank space, and improves page space utilization. The optimal width is determined according to the actual situation of the container width and the description column, so that the page layout is more reasonable and the overall visual effect is improved. It can adapt to different page container widths and description column content lengths, flexibly adjust the width, and ensure that a good display effect can be presented in various situations.

[0025] It should be understood that the contents described in this section are not intended to identify the key or important features of the embodiments of the present invention, nor are they intended to limit the scope of the present invention. Other features of the present invention will become easily understood through the following description. BRIEF DESCRIPTION OF THE DRAWINGS

[0026] In order to more clearly illustrate the technical solutions in the embodiments of the present invention, the drawings required for use in the description of the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.

[0027] Figure 1 is a flow chart of a method for setting the width of a page description column provided according to a first embodiment of the present invention;

[0028] Figure 2 is a flow chart of another method for setting the width of a page description column provided according to a second embodiment of the present invention;

[0029] Figure 3 is a schematic diagram of the structure of a device for setting the width of a page description column provided according to a third embodiment of the present invention;

[0030] Figure 4 The present invention is a schematic diagram of the structure of an electronic device for implementing a method for setting the width of a page description column according to an embodiment of the present invention. DETAILED DESCRIPTION

[0031] In order to enable those skilled in the art to better understand the scheme of the present invention, the technical scheme in the embodiments of the present invention will be clearly and completely described below in conjunction with the drawings in the embodiments of the present invention. Obviously, the described embodiments are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work should fall within the scope of protection of the present invention.

[0032] It should be noted that the terms "first", "second", etc. in the specification and claims of the present invention and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchanged where appropriate, so that the embodiments of the present invention described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having" and any variations thereof are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device that includes a series of steps or units is not necessarily limited to those steps or units that are clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.

[0033] Embodiment 1

[0034] Figure 1 A flowchart of a method for setting the width of a page description column is provided for the first embodiment of the present invention. This embodiment is applicable to the case of setting the display of a web page. The method can be executed by a device for setting the width of a page description column. The device for setting the width of a page description column can be implemented in the form of hardware and / or software. The device for setting the width of a page description column can be configured in a computer controller. Figure 1 As shown, the method includes:

[0035] S110 , obtaining the container width of the page to be displayed, and determining the total width of the description column to be displayed, wherein the total width of the description column is the sum of the original width of the label column and the original width of the value column.

[0036] The page to be displayed refers to the page that the user is about to see. In the page to be displayed, there will be a layout of instructions and their corresponding values ​​for display. The container width refers to the width of a specific area in the page for placing the instruction column and the value column, which determines the size of the space available for the instruction column and the value column. The instruction column refers to a column in the page layout that is specifically used to display instructional content. The instruction column includes two sides, namely the left label column and the right value column. The left label column is used to display instructions, and the right value column is used to display the value corresponding to the instruction. The total width of the instruction column is the sum of the original width of the label column and the original width of the value column, that is, the ideal width required for the instruction part and the corresponding value part when the page layout restrictions are not considered. For example, in a device specification display, the original width of the "battery capacity" label column is 80 pixels, and the original width of the "5000mAh" value column is 100 pixels, then the total width of the instruction column is 180 pixels. The total width of the instruction column can be used as the basic data for judging whether the instruction column can be displayed normally in a given container. The original width of the label column refers to the width determined only by the label content itself without considering the page layout constraints. Its size is mainly affected by factors such as the number of label characters, font size, and font spacing. The original width of the value column refers to the width required by the value content when the page layout restrictions are not considered. The value column content may be numbers, text, symbols, etc., and its original width depends on the characteristics of the content itself.

[0037] Specifically, the container width is affected by many factors, such as the browser window size, media query rules in responsive design, etc. The container width can be obtained through JavaScript's Document Object Model DOM.

[0038] S120: Determine the occupancy of the description column according to the container width and the total width of the description column, wherein the occupancy of the description column includes exceeding the container range and not exceeding the container range.

[0039] The description column occupancy is used to describe the relationship between the description column and the container width, which is divided into two situations: exceeding the container range and not exceeding the container range. The description column occupancy directly affects the final display effect and layout adjustment strategy of the description column. Exceeding the container range means that part of the content of the description column will exceed the container boundary, resulting in an incomplete display or affecting the overall layout of the page. When it does not exceed the container range, it can be fully displayed in the container according to the original width, and there will be no problem of content overflowing the container boundary, and there is no need to significantly adjust the column width to adapt to the container.

[0040] Optionally, determining the description column occupancy according to the container width and the total description column width includes: judging whether the total description column width is greater than or equal to the container width, and if so, determining that the description column occupancy exceeds the container range; otherwise, determining that the description column occupancy does not exceed the container range.

[0041] Specifically, the total width of the description column and the container width can be compared, and then the occupancy status of the description column in the container can be determined based on the comparison result. When the total width of the description column is greater than or equal to the container width, it indicates that the overall width of the description column exceeds the range that the container can accommodate. In this case, the description column occupancy is determined to exceed the container range. When it exceeds the container range, if the content of the description column is displayed according to the original width, some content will not be displayed or will overflow the container boundary. When the total width of the description column is less than the container width, it indicates that there is enough space in the container for the description column to be fully displayed. In this case, it can be determined that the description column occupancy does not exceed the container range. When it does not exceed the container range, the description column can be displayed normally in the container according to the originally set width, and there will be no layout conflicts.

[0042] S130 . Determine a final description column width according to the description column occupancy, and generate a final display page based on the final description column width, wherein the final description column width includes a final label column width and a final value column width.

[0043] The final description column width refers to the actual display width of the description column determined after adjustment based on the description column occupancy. The final description column width is determined to ensure that the description column can be reasonably displayed in the container and to meet the requirements of each making the best use of space, not affecting the other column, and not squeezing out of the visible area. The final description column width includes the final label column width and the final value column width. The final label column width refers to the width value used by the final label column displayed on the page. The final value column width refers to the width value determined when the value column is finally displayed on the page.

[0044] Optionally, the final description column width is determined based on the description column occupancy, including: when the description column occupancy exceeds the container range, half of the container width is used as the target width; determine whether the original width of the label column and the original width of the value column are both greater than the target width, and if so, use the target width as the final width of the label column and the final width of the value column; otherwise, determine the final description column width based on the original width of the label column and the target width.

[0045] When it is determined that the description column occupancy exceeds the container range, the controller can use half of the container width as the target width, that is, when the container width is 400px, the target width is 200px. The controller refers to a computer controller that determines the width of the page description column.

[0046] Specifically, the controller will determine whether the original width of the label column and the original width of the value column are both greater than the target width. If both are greater than the target width, it means that the original width is too large and exceeds the range allowed by the target width. At this time, the controller will use the target width as the final width of the label column and the final width of the value column to ensure that both the label column and the value column can be displayed within the target width range to avoid exceeding the container range. For example, the original width of the label column is 250px, the original width of the value column is 300px, and the target width is 200px, then the controller will adjust the final width of the label column and the final width of the value column to 200px. When the original widths of the label column and the value column are not both greater than the target width, it means that the original width of at least one column is not greater than the target width. At this time, it is necessary to determine the final description column width based on the original width of the label column and the target width.

[0047] Optionally, the final description column width is determined according to the original width and the target width of the label column, including: determining whether the original width of the label column is smaller than the target width, if so, calculating a first difference between the container width and the original width of the label column, using the first difference as the final width of the value column, and directly using the original width of the label column as the final width of the label column; otherwise, calculating a second difference between the container width and the original width of the value column, using the second difference as the final width of the label column, and directly using the original width of the value column as the final width of the value column.

[0048] Specifically, when the original width of the label column is smaller than the target width, the controller will calculate the first difference between the container width and the original width of the label column. For example, the container width is 400px, and the original width of the label column is 150px, then the first difference is 400-150=250px. At this time, the controller will use the first difference as the final width of the value column, because in this case, the original width of the label column is smaller, and it can be allowed to maintain its original width without exceeding the container range, and the remaining space is allocated to the value column. Therefore, the final width of the label column directly takes its original width of 150px, and the final width of the value column is 250px. The allocation method of this embodiment can maintain the original display effect of the label column as much as possible while meeting the container space limitation, and also reasonably utilize the remaining space for the value column.

[0049] Similarly, when the original width of the label column is greater than or equal to the target width, the controller will calculate the second difference between the container width and the original width of the value column. For example, the container width is 400px, the original width of the label column is 250px, and the original width of the value column is 200px. Since the original width of the label column is larger, the remaining space should be allocated based on the original width of the value column. The second difference is 400-200=200px. The controller will use the second difference as the final width of the label column, and the final width of the value column will directly take its original width of 200px.

[0050] Optionally, the final description column width is determined based on the description column occupancy, including: when the description column occupancy does not exceed the container range, judging whether the original width of the label column is smaller than the original width of the value column; if so, directly using the original width of the label column as the final width of the label column, and calculating the third difference between the container width and the final width of the label column, and using the third difference as the final width of the value column; otherwise, directly using the original width of the value column as the final width of the value column, and calculating the fourth difference between the container width and the final width of the value column, and using the fourth difference as the final width of the label column.

[0051] Among them, when the total width of the description column is less than or equal to the container width, the description column does not exceed the container range. At this time, there is enough space to display the description column. However, in order to better utilize the space and maintain the rationality of the layout, it is necessary to further judge the relationship between the original widths of the label column and the value column to determine the final display width.

[0052] Specifically, the controller can reasonably allocate the space in the container according to the width characteristics of the original contents of the two columns. When the original width of the label column is less than the original width of the value column, it indicates that the content of the value column is relatively large or occupies more space. When the container width is 400px, the original width of the label column is 100px, and the original width of the value column is 250px, the original width of the label column is less than the original width of the value column. At this time, the controller can directly use the original width of the label column as the final width of the label column, that is, the controller will calculate the third difference between the container width and the final width of the label column, and use it as the final width of the value column to make full use of the remaining space of the container, so that the value column can display as much content as possible without exceeding the container. The calculation formula is: final width of value column = container width - final width of label column. When the original width of the label column is greater than or equal to the original width of the value column, the controller can directly use the original width of the value column as the final width of the value column. Then calculate the fourth difference between the container width and the final width of the value column, and use it as the final width of the label column. The calculation formula is: final width of label column = container width - final width of value column. Through the technical solution of the embodiment of the present invention, the final width can be reasonably determined according to the different original widths of the two columns, thereby achieving efficient and reasonable layout in the container.

[0053] The technical solution of the embodiment of the present invention ensures that the description column can make full use of the available space of the page container through precise calculation and judgment, reduces page blank space, and improves page space utilization. The optimal width is determined according to the actual situation of the container width and the description column, so that the page layout is more reasonable and the overall visual effect is improved. It can adapt to different page container widths and description column content lengths, flexibly adjust the width, and ensure that a good display effect can be presented in various situations.

[0054] Embodiment 2

[0055] Figure 2This is a flow chart of a method for setting the width of a page description column provided in the second embodiment of the present invention. This embodiment adds a specific process for generating a final display page based on the final description column width on the basis of the first embodiment. The specific contents of steps S210-S220 are roughly the same as steps S110-S120 in the first embodiment, so they will not be described in detail in this embodiment. Figure 2 As shown, the method includes:

[0056] S210: Obtain the container width of the page to be displayed, and determine the total width of the description column to be displayed, wherein the total width of the description column is the sum of the original width of the label column and the original width of the value column.

[0057] S220: Determine the occupancy of the description column according to the container width and the total width of the description column, wherein the occupancy of the description column includes exceeding the container range and not exceeding the container range.

[0058] Optionally, determining the description column occupancy according to the container width and the total description column width includes: judging whether the total description column width is greater than or equal to the container width, and if so, determining that the description column occupancy exceeds the container range; otherwise, determining that the description column occupancy does not exceed the container range.

[0059] S230 . Determine a final description column width according to the description column occupancy, wherein the final description column width includes a final label column width and a final value column width.

[0060] Optionally, the final description column width is determined based on the description column occupancy, including: when the description column occupancy exceeds the container range, half of the container width is used as the target width; determine whether the original width of the label column and the original width of the value column are both greater than the target width, and if so, use the target width as the final width of the label column and the final width of the value column; otherwise, determine the final description column width based on the original width of the label column and the target width.

[0061] Optionally, the final description column width is determined according to the original width and the target width of the label column, including: determining whether the original width of the label column is smaller than the target width, if so, calculating a first difference between the container width and the original width of the label column, using the first difference as the final width of the value column, and directly using the original width of the label column as the final width of the label column; otherwise, calculating a second difference between the container width and the original width of the value column, using the second difference as the final width of the label column, and directly using the original width of the value column as the final width of the value column.

[0062] Optionally, the final description column width is determined based on the description column occupancy, including: when the description column occupancy does not exceed the container range, judging whether the original width of the label column is smaller than the original width of the value column; if so, directly using the original width of the label column as the final width of the label column, and calculating the third difference between the container width and the final width of the label column, and using the third difference as the final width of the value column; otherwise, directly using the original width of the value column as the final width of the value column, and calculating the fourth difference between the container width and the final width of the value column, and using the fourth difference as the final width of the label column.

[0063] S240: Display the description column to be displayed based on the final description column width, and determine the excess portion of the description column to be displayed.

[0064] Specifically, after determining the final width of the label column and the final width of the value column, you can use HTML and CSS technology to implement page display. For example, in the HTML structure, define the corresponding widths of the label column and the value column. Elements, use the CSS width attribute to set the final width values ​​for these two elements respectively.

[0065] Optionally, determining the excess portion of the description column to be displayed includes: determining the excess portion of the label column according to the original width of the label column and the final width of the label column; determining the excess portion of the value column according to the original width of the value column and the final width of the value column; and using the excess portion of the label column and the excess portion of the value column as the excess portion of the description column to be displayed.

[0066] It can be known that by comparing the original width of the label column with the final width of the label column, it can be determined whether there is any excess content in the label column after the width is adjusted. The same is true for the excess content in the value column. When the original width is greater than the final width, the difference is the excess content. In actual applications, the excess content may be displayed in a specific way on the page, such as using ellipsis to display the excess content in the label column and using a specific icon to indicate the excess content in the value column, so that users can understand that there is hidden content.

[0067] S250: Display the excess portion according to a preset style to generate a final display page.

[0068] In a specific implementation, on a product details page, various parameters of the product need to be displayed, such as "size" and "weight", which belong to the label column, and the corresponding specific numerical values ​​are the value column. According to the determined final width, the label column and the value column are like different areas on a shelf, each occupying a specific space, and are arranged in an orderly manner on the page to form a clear description display structure. The display method of this embodiment can be well adapted to various page scenarios. For example, under different screen sizes, the page container width will change, and the final description column width will also be adjusted accordingly. Taking mobile phones and tablets as examples, the mobile phone screen is narrow and the container width is small, so the description column width will be reduced accordingly; the tablet screen is wide and the container width is large, so the description column width will also increase. Finally, a page with complete information, reasonable layout and beautiful appearance is presented to the user.

[0069] The technical solution of the embodiment of the present invention ensures that the description column can fully utilize the available space of the page container through precise calculation and judgment, reduces page blank space, and improves page space utilization. It can adapt to label columns and value columns of different lengths, and improve the adaptability of the page in various data situations. It can accurately determine the excess part of the description column to be displayed, and achieve more accurate page layout and content display. The excess part is displayed according to the preset style, making the page presentation more neat and orderly, and improving the overall visual effect.

[0070] Embodiment 3

[0071] Figure 3 This is a schematic diagram of a structure of a device for setting the width of a page description column provided in Embodiment 3 of the present invention. Figure 3 As shown, the device includes: a width acquisition module 310, which is used to acquire the container width of the page to be displayed, and determine the total width of the description column to be displayed, wherein the total width of the description column is the sum of the original width of the label column and the original width of the value column;

[0072] The description column occupancy determination module 320 is used to determine the description column occupancy according to the container width and the total description column width, wherein the description column occupancy includes exceeding the container range and not exceeding the container range;

[0073] The final display page generating module 330 is used to determine the final description column width according to the description column occupancy, and generate the final display page based on the final description column width, wherein the final description column width includes the final label column width and the final value column width.

[0074] Optionally, the description column occupancy determination module 320 is specifically used to: determine whether the total width of the description column is greater than or equal to the container width, and if so, determine that the description column occupancy exceeds the container range; otherwise, determine that the description column occupancy does not exceed the container range.

[0075] Optionally, the final display page generation module 330 specifically includes: an out-of-container range setting unit, used to: when the description column occupancy exceeds the container range, use half of the container width as the target width; determine whether the original width of the label column and the original width of the value column are both greater than the target width, and if so, use the target width as the final width of the label column and the final width of the value column; otherwise, determine the final description column width based on the original width of the label column and the target width.

[0076] Optionally, the unit for setting the range beyond the container specifically includes: a subunit for determining the original width of the label column, used to: determine whether the original width of the label column is smaller than the target width, if so, calculate a first difference between the container width and the original width of the label column, use the first difference as the final width of the value column, and directly use the original width of the label column as the final width of the label column; otherwise, calculate a second difference between the container width and the original width of the value column, use the second difference as the final width of the label column, and directly use the original width of the value column as the final width of the value column.

[0077] Optionally, the final display page generation module 330 specifically includes: a container range setting unit, which is used to: when the description column occupancy is within the container range, determine whether the original width of the label column is smaller than the original width of the value column; if so, directly use the original width of the label column as the final width of the label column, and calculate the third difference between the container width and the final width of the label column, and use the third difference as the final width of the value column; otherwise, directly use the original width of the value column as the final width of the value column, and calculate the fourth difference between the container width and the final width of the value column, and use the fourth difference as the final width of the label column.

[0078] Optionally, the final display page generation module 330 specifically includes: a final display page generation unit, used to: display the description column to be displayed based on the final description column width, and determine the excess part of the description column to be displayed; display the excess part according to a preset style to generate a final display page.

[0079] Optionally, the final display page generates a sub-unit, specifically including: an excess part setting sub-unit, used to: determine the excess part of the label column according to the original width of the label column and the final width of the label column; determine the excess part of the value column according to the original width of the value column and the final width of the value column; and use the excess part of the label column and the excess part of the value column as the excess part of the description column to be displayed.

[0080] The technical solution of the embodiment of the present invention ensures that the description column can make full use of the available space of the page container through precise calculation and judgment, reduces page blank space, and improves page space utilization. The optimal width is determined according to the actual situation of the container width and the description column, so that the page layout is more reasonable and the overall visual effect is improved. It can adapt to different page container widths and description column content lengths, flexibly adjust the width, and ensure that a good display effect can be presented in various situations.

[0081] A device for setting the width of a page description column provided by an embodiment of the present invention can execute a method for setting the width of a page description column provided by any embodiment of the present invention, and has corresponding functional modules and beneficial effects of the execution method.

[0082] Embodiment 4

[0083] Figure 4 A schematic diagram of the structure of an electronic device 10 that can be used to implement an embodiment of the present invention is shown. The electronic device is intended to represent various forms of digital computers, such as laptop computers, desktop computers, workstations, personal digital assistants, servers, blade servers, mainframe computers, and other suitable computers. The electronic device can also represent various forms of mobile devices, such as personal digital assistants, cellular phones, smart phones, wearable devices (such as helmets, glasses, watches, etc.) and other similar computing devices. The components shown herein, their connections and relationships, and their functions are merely examples and are not intended to limit the implementation of the present invention described and / or required herein.

[0084] like Figure 4 As shown, the electronic device 10 includes at least one processor 11, and a memory connected to the at least one processor 11, such as a read-only memory (ROM) 12, a random access memory (RAM) 13, etc., wherein the memory stores a computer program that can be executed by at least one processor, and the processor 11 can perform various appropriate actions and processes according to the computer program stored in the read-only memory (ROM) 12 or the computer program loaded from the storage unit 18 to the random access memory (RAM) 13. In the RAM 13, various programs and data required for the operation of the electronic device 10 can also be stored. The processor 11, the ROM 12, and the RAM 13 are connected to each other through a bus 14. An input / output (I / O) interface 15 is also connected to the bus 14.

[0085] A number of components in the electronic device 10 are connected to the I / O interface 15, including: an input unit 16, such as a keyboard, a mouse, etc.; an output unit 17, such as various types of displays, speakers, etc.; a storage unit 18, such as a disk, an optical disk, etc.; and a communication unit 19, such as a network card, a modem, a wireless communication transceiver, etc. The communication unit 19 allows the electronic device 10 to exchange information / data with other devices through a computer network such as the Internet and / or various telecommunication networks.

[0086] The processor 11 may be a variety of general and / or special processing components with processing and computing capabilities. Some examples of the processor 11 include, but are not limited to, a central processing unit (CPU), a graphics processing unit (GPU), various special artificial intelligence (AI) computing chips, various processors running machine learning model algorithms, a digital signal processor (DSP), and any appropriate processor, controller, microcontroller, etc. The processor 11 executes the various methods and processes described above, such as a method for setting the width of a page description column.

[0087] In some embodiments, a method for setting the width of a page description column may be implemented as a computer program, which is tangibly contained in a computer-readable storage medium, such as a storage unit 18. In some embodiments, part or all of the computer program may be loaded and / or installed on the electronic device 10 via the ROM 12 and / or the communication unit 19. When the computer program is loaded into the RAM 13 and executed by the processor 11, one or more steps of the method for setting the width of a page description column described above may be performed. Alternatively, in other embodiments, the processor 11 may be configured to perform a method for setting the width of a page description column in any other appropriate manner (e.g., by means of firmware).

[0088] Various implementations of the systems and techniques described above herein can be implemented in digital electronic circuit systems, integrated circuit systems, field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chips (SOCs), load programmable logic devices (CPLDs), computer hardware, firmware, software, and / or combinations thereof. These various implementations can include: being implemented in one or more computer programs that can be executed and / or interpreted on a programmable system including at least one programmable processor, which can be a special purpose or general purpose programmable processor that can receive data and instructions from a storage system, at least one input device, and at least one output device, and transmit data and instructions to the storage system, the at least one input device, and the at least one output device.

[0089] Computer programs for implementing the methods of the present invention may be written in any combination of one or more programming languages. These computer programs may be provided to a processor of a general-purpose computer, a special-purpose computer, or other programmable data processing device, so that when the computer program is executed by the processor, the functions / operations specified in the flow chart and / or block diagram are implemented. The computer program may be executed entirely on the machine, partially on the machine, partially on the machine and partially on a remote machine as a stand-alone software package, or entirely on a remote machine or server.

[0090] In the context of the present invention, a computer-readable storage medium may be a tangible medium that may contain or store a computer program for use by or in combination with an instruction execution system, device or equipment. A computer-readable storage medium may include, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, devices or equipment, or any suitable combination of the foregoing. Alternatively, a computer-readable storage medium may be a machine-readable signal medium. A more specific example of a machine-readable storage medium may include an electrical connection based on one or more lines, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

[0091] To provide interaction with a user, the systems and techniques described herein may be implemented on an electronic device having: a display device (e.g., a CRT (cathode ray tube) or LCD (liquid crystal display) monitor) for displaying information to the user; and a keyboard and a pointing device (e.g., a mouse or trackball) through which the user can provide input to the electronic device. Other types of devices may also be used to provide interaction with the user; for example, the feedback provided to the user may be any form of sensory feedback (e.g., visual feedback, auditory feedback, or tactile feedback); and input from the user may be received in any form (including acoustic input, voice input, or tactile input).

[0092] The systems and techniques described herein may be implemented in a computing system that includes backend components (e.g., as a data server), or a computing system that includes middleware components (e.g., an application server), or a computing system that includes frontend components (e.g., a user computer with a graphical user interface or a web browser through which a user can interact with implementations of the systems and techniques described herein), or a computing system that includes any combination of such backend components, middleware components, or frontend components. The components of the system may be interconnected by any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include: a local area network (LAN), a wide area network (WAN), a blockchain network, and the Internet.

[0093] A computing system may include a client and a server. The client and the server are generally remote from each other and usually interact through a communication network. The client and server relationship is generated by computer programs running on the corresponding computers and having a client-server relationship with each other. The server may be a cloud server, also known as a cloud computing server or cloud host, which is a host product in the cloud computing service system to solve the defects of difficult management and weak business scalability in traditional physical hosts and VPS services.

[0094] It should be understood that the various forms of processes shown above can be used to reorder, add or delete steps. For example, the steps described in the present invention can be executed in parallel, sequentially or in different orders, as long as the desired results of the technical solution of the present invention can be achieved, and this document does not limit this.

[0095] The above specific implementations do not constitute a limitation on the protection scope of the present invention. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions can be made according to design requirements and other factors. Any modification, equivalent substitution and improvement made within the spirit and principle of the present invention should be included in the protection scope of the present invention.

Claims

1. A method for setting the width of a page description column, characterized in that: include: Obtain the container width of the page to be displayed, and determine the total width of the description column to be displayed, wherein the total width of the description column is the sum of the original width of the label column and the original width of the value column; Determine the description column occupancy status according to the container width and the total description column width, wherein the description column occupancy status includes exceeding the container range and not exceeding the container range; The final description column width is determined according to the description column occupancy, and a final display page is generated based on the final description column width, wherein the final description column width includes a final label column width and a final value column width.

2. The method according to claim 1, characterized in that The determining the description column occupancy according to the container width and the total description column width includes: Determine whether the total width of the description column is greater than or equal to the container width, and if so, determine that the description column occupancy exceeds the container range; Otherwise, it is determined that the description column occupancy condition does not exceed the container range.

3. The method according to claim 1, characterized in that: The determining of the final description column width according to the description column occupancy condition includes: When the description column occupies more than the container range, half of the container width is used as the target width; Determine whether the original width of the label column and the original width of the value column are both greater than the target width, and if so, use the target width as the final width of the label column and the final width of the value column; Otherwise, the final description column width is determined according to the original width of the label column and the target width.

4. The method according to claim 3, characterized in that The determining the final description column width according to the original width of the label column and the target width includes: Determine whether the original width of the label column is less than the target width. If so, calculate a first difference between the container width and the original width of the label column, use the first difference as the final width of the value column, and directly use the original width of the label column as the final width of the label column; Otherwise, the second difference between the container width and the original width of the value column is calculated, the second difference is used as the final width of the label column, and the original width of the value column is directly used as the final width of the value column.

5. The method according to claim 1, characterized in that The determining of the final description column width according to the description column occupancy condition includes: When the occupancy of the description column does not exceed the container range, determine whether the original width of the label column is less than the original width of the value column. If so, directly use the original width of the label column as the final width of the label column, and calculate the third difference between the container width and the final width of the label column, and use the third difference as the final width of the value column; Otherwise, the original width of the value column is directly used as the final width of the value column, and the fourth difference between the container width and the final width of the value column is calculated, and the fourth difference is used as the final width of the label column.

6. The method according to claim 1, characterized in that The generating a final display page based on the final description column width includes: Displaying the description column to be displayed based on the final description column width, and determining an excess portion of the description column to be displayed; The excess portion is displayed in a preset style to generate the final display page.

7. The method according to claim 6, characterized in that The determining the excess portion of the description column to be displayed includes: Determine the excess portion of the label column according to the original width of the label column and the final width of the label column; Determine the excess portion of the value column according to the original width of the value column and the final width of the value column; The excess portion of the label column and the excess portion of the value column are taken as the excess portion of the description column to be displayed.

8. A device for setting the width of a page description column, characterized in that: include: A width acquisition module, used to acquire the container width of the page to be displayed, and determine the total width of the description column to be displayed, wherein the total width of the description column is the sum of the original width of the label column and the original width of the value column; A description column occupancy determination module, used to determine the description column occupancy according to the container width and the total description column width, wherein the description column occupancy includes exceeding the container range and not exceeding the container range; The final display page generation module is used to determine the final description column width according to the description column occupancy, and generate the final display page based on the final description column width, wherein the final description column width includes the final label column width and the final value column width.

9. An electronic device, characterized in that: The electronic device comprises: at least one processor; and a memory communicatively coupled to the at least one processor; The memory stores a computer program that can be executed by the at least one processor, and the computer program is executed by the at least one processor so that the at least one processor can execute the method according to any one of claims 1 to 7.

10. A computer storage medium, characterized in that: The computer storage medium stores computer instructions, and the computer instructions are used to enable a processor to implement the method according to any one of claims 1 to 7 when executed.