网页的显示处理方法及装置技术领域
本发明涉及网络技术领域，尤其涉及网页的显示处理方法及装置。
背景技术
随着移动互联网的快速发展，通过手机访问互联网，可以获得各种各样
的信息。但是由于手机的屏幕限制，若在手机上访问较大的页面，可能需要
滚动页面，以进行信息的完整阅读。现有技术中，常采用将背景图全部过滤，
高度被设置为auto。通过上述处理后，虽然可以达到显示的页面适用显示屏
幕进行显示的目的，但是其显示效果不佳，甚至会造成部分元素无法显示。
发明内容
本发明实施例的主要目的在于解决现有技术中为达到显示的页面适用显
示屏幕进行显示的目的时，显示的效果不佳的技术问题。
为实现上述目的，本发明实施例提供了一种网页的显示处理方法，包括
以下步骤：
接收页面显示请求，所述页面显示请求包括待显示的页面数据，且所述
页面数据为web页面；
根据所述页面显示请求，对待显示的页面数据进行解析，并生成render
树，同时获得所述render树中所有render节点的样式；
按照预设的样式规则，对各render节点的样式进行调整，获得各render节
点最终的样式；
按照预设的宽度规则，对各render节点对应的元素的宽度进行调整，获
得各render节点对应的元素的最终宽度。
此外，为实现上述目的，本发明实施例还提供了一种网页的显示处理
装置，包括：
页面数据接收模块，用于接收页面显示请求，所述页面显示请求包括待
显示的页面数据，且所述页面数据为web页面；
页面数据解析模块，用于根据所述页面显示请求，对待显示的页面数据
进行解析，并生成render树，同时获得所述render树中所有render节点的样式；
样式调整模块，用于按照预设的样式规则，对各render节点的样式进行
调整，获得各render节点最终的样式；
宽度调整模块，用于按照预设的宽度规则，对各render节点对应的元素
的宽度进行调整，获得render节点对应的元素的最终宽度。
本发明实施例通过预先设置的样式规则以及宽度规则，分别对各render
节点的样式及对应的元素的逻辑宽度进行调整，从而使得页面可以在显示终
端的显示屏幕上自适应进行显示，不需要左右滚动页面，而且显示效果更佳。
附图说明
图1是本发明网页的显示处理方法所实现的终端的硬件架构示意图；
图2是本发明网页的显示处理方法的流程示意图；
图3是本发明网页的显示处理方法中根据背景图过滤规则对各render节
点的样式进行调整的细化流程示意图；
图4是本发明网页的显示处理方法相关的render树的示例图；
图5是本发明网页的显示处理方法中根据高度规则对各render节点的样
式进行调整的细化流程示意图；
图6是本发明相关的元素的结构示例图；
图7是本发明网页的显示处理方法中根据行高规则对各render节点的样
式进行调整的细化流程示意图；
图8是本发明网页的显示处理方法中根据空格处理规则对各render节点
的样式进行调整的细化流程示意图；
图9是本发明网页的显示处理方法中根据显示属性调整规则对各render
节点的样式进行调整的细化流程示意图；
图10是本发明网页的显示处理方法中根据宽度规则对各render节点对
应的元素的宽度进行调整的细化流程示意图；
图11是本发明相关的父亲元素与子元素的结构示例图；
图12是本发明页面的显示处理装置的功能模块示意图；
图13是本发明页面的显示处理装置中样式调整模块的细化功能模块
示意图。
本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步
说明。
具体实施方式
以下结合说明书附图及具体实施例进一步说明本发明的技术方案。应当
理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。
本发明的核心思想是，通过预先设置页面的显示规则，当终端访问的页
面的宽度大于终端屏幕的显示宽度时，利用该页面的显示规则对页面数据进
行处理，以使处理后的页面的宽度适应终端屏幕的显示宽度。根据该页面的
显示规则所处理的页面可以解决现有技术中直接过滤背景图而导致页面显示
效果很差的技术问题。
如图1所示，本发明所运行的显示终端可包括处理器101、存储器102、用
户接口103、网络接口104、通信总线105。通信总线105用于终端中各组成部
件之间的通信，用户接口103可包括输入模块及显示模块，其中输入模块用于
接收用户输入的信息，并将其发送至处理器101，以供处理器101进行相应的
处理，并控制显示模块对处理结果进行显示。网络接口104用于显示终端与外
部进行互相通信，该网络接口主要包括有线接口和无线接口，例如RS232模
块、射频模块、WIFI模块等等。该终端上安装有各种应用程序，例如浏览器，
用户利用该浏览器，并通过网络接口可访问互联网，以获得互联网上的各种
信息。例如即时通讯软件，用户利用即时通讯软件，并通过网络接口与其他
用户进行信息互通。存储器102可以包括一个或一个以上计算机可读存储介
质，而且其不但包括内部存储器，还包括外部存储器。该存储器中存储有操
作系统、页面的显示处理系统等其他系统。处理器101则可以调用存储器102
中的页面的显示处理系统，以实现页面适应显示终端的显示屏幕进行显示，
且显示效果更佳，甚至不会造成页面元素的丢失。
如图2所示，基于上述终端，处理器101调用存储器102中的页面的显示处
理系统，实现的页面的显示处理方法包括以下步骤：
步骤S110、接收服务器根据终端发起的页面访问请求而返回的页面数
据，且所述页面数据为web页面的数据；
显示终端利用浏览器向服务器发起页面访问请求，服务器则获取要访问
的页面数据，并将获取的页面数据通过页面显示请求返回至所述显示终端。
显示终端则接收页面数据，并判断该页面数据是否为web页面，若是则需要
对页面的显示进行处理，若不是则不做处理，对页面数据进行显示。本实施
例中，该显示终端包括手机、平板电脑、ipad、掌上电脑等屏幕相对较小的
终端。web页面是指用于在PC机上显示，且页面的宽度比显示终端的显示屏
幕的宽度大的页面。
步骤S120、对待显示的页面数据进行解析，并生成render树，同时获得
所述render树中所有render节点的样式；
对接收到的页面数据进行解析，并生成dom树和render树。其中，dom树
用于描述页面的信息，render树用于设置dom树的页面布局及页面样式，以控
制dom树如何显示在显示终端的屏幕上。因此，在对待显示的页面数据进行
解析后生成的render树中，可以获得所有render节点的原始样式。
步骤S130、按照预设的样式规则，对各render节点的样式进行调整，获
得各render节点最终的样式；
本发明实施例预先设置相应的样式规则，该样式规则可包括背景图过滤
规则、高度规则、行高规则、flattern规则、字体反色规则、边框空白规则、
边界处理规则、空格处理规则及输入框处理规则等等。根据该预先设置的样
式规则，依次获取render树的各render节点，并对各render节点的样式进行调
整，待所有render节点都进行样式调整后，根据调整后的render节点样式进行
控制的页面显示将满足自适应显示屏幕的要求。
步骤S140、按照预设的宽度规则，对各render节点对应的元素的宽度进
行调整，获得各render节点对应的元素的最终宽度。
本发明实施例预先设置相应的宽度规则，该宽度规则用于处理页面中各
元素的逻辑宽度大于显示终端的屏幕宽度时，对各元素的逻辑宽度进行调整，
以使得页面的显示满足自适应显示屏幕。网页由多个元素组成，该元素可包
括文本、图像、动画、视频、超链接、表格、框架、表单等基本元素，当然
还可包括横幅广告、字母、悬停按钮、日戳、计算器、音频、视频、JavaApplet
等其他元素。
本发明实施例通过预先设置的样式规则以及宽度规则，分别对各render
节点的样式及对应的元素的逻辑宽度进行调整，从而使得页面可以在显示终
端的显示屏幕上自适应进行显示，不需要左右滚动页面，而且显示效果更佳，
甚至不会造成页面元素的丢失。
以下将对不同的样式规则的样式调整过程进行具体的描述。
(一)背景图过滤规则
依次获得每个render节点的样式，其中包括当前render节点的属性及属性
值、该render节点的元素类型等等。然后按照预设背景图规则，对当前render
节点的样式进行判断，确定当前render节点的样式中是否需要清除背景图，
若当前render节点的样式中需要清除背景图，则清除所述当前render节点的背
景图。
如图3所示，具体的背景图过滤过程可包括：
步骤S201、判断当前render节点的属性text-indent是否小于零；当属性
text-indent小于零时，转入步骤S202，否则转入步骤S203；
遍历render树上的每个render节点的样式属性，获取当前render节点的属
性text-indent的值，并判断text-indent的值是否小于零。其中属性text-indent表
示离左边界的距离。
步骤S202、清除所述当前render节点的父亲链上所有render节点的背景
图；
当当前render节点的属性text-indent小于零时，清除当前render节点的父亲
链的背景图。如图4所示，该render树包括6个render节点，其中节点1为根节
点。若当前render节点为节点4，且该节点4的属性text-indent<0，则找到该节
点4的父亲链，即节点1-节点2-节点4，然后将该父亲链上所有节点的背景图
清除，具体为，设置父亲链上所有节点的图片的高度和宽度均为零。
步骤S203、当所述当前render节点的属性display为block或table，且所述
当前render节点有背景图且没有被清除，清除所述当前render节点的背景图；
当所述当前render节点的属性text-indent大于或等于零时，则判断当前
render节点的属性display是否为block或table，是则判断当前render节点是否有
背景图且没有被清除，否则不做处理。具体为：根据render节点的样式中的
属性hasBackgroundImage的值来判断是否有背景图。同时还将增加是否被清
除的标记。例如，标记为0，则该背景图没有被清除，标记为1，则该背景图
被清除。当当前render节点有背景图且没有被清除时，则清除当前render节点
的图片的高度和宽度均为零。
进一步地，上述背景图过滤过程还可包括：
步骤S204、当所述当前render节点对应的元素为inline元素时，判断所述
当前render节点是否有背景图或者render节点的背景图没有被清除；当所述当
前render节点有背景图或者所述当前render节点的背景图没有被清除时，转入
步骤S205，否则转入步骤S206；
步骤S205、设置所述当前render节点的属性text-indent＝0；
步骤S206、当所述当前render节点的父亲节点的属性text-indent小于零时，
设置所述当前render节点的属性text-indent＝0。
当当前render节点的父亲节点的属性text-indent大于或等于零时，不做处
理。
(二)高度规则
依次获得每个render节点的样式，其中包括当前render节点的属性及属性
值、该render节点的元素类型等等。然后按照预设的高度规则，对当前render
节点的样式进行判断，确定当前render节点的样式中是否需要进行高度调整，
若当前render节点的样式中需要进行高度调整，则进行相应的高度调整。
如图5所示，具体的高度调整过程可包括：
步骤S301、判断所述当前render节点对应的元素为inline元素或者所述当
前render节点对应的标签为img、button、input或i标签；是则转入步骤S302，
否则转入步骤S307；
步骤S302、设置所述当前render节点对应的元素的高度为最小高度；
该最小高度是指元素高度的最低限制值。
步骤S303、当所述当前render节点的父亲节点的属性line-Height大于零
时，清除所述当前render节点的父亲链上所有render节点对应的元素的高度；
获取当前render节点的父亲节点的属性line-Height是否大于零。正常情况
下，该父亲节点的属性line-Height是大于或等于零，但是有网页开发者，为
了显示图片而不显示文字，会把line-Height设置为小于零。因此在判断当前
render节点的父亲节点的属性line-Height大于零时，清除所述当前render节点
的父亲链的高度。具体为，将父亲链上所有节点的对应的元素的高度设置为
auto。如图3所示，该render树包括6个render节点，其中节点1为根节点。若当
前render节点为节点4，且该节点4的父亲节点(也就是节点2)的属性
line-height>0，则找到该节点4的父亲链，即节点1-节点2-节点4，然后将该父
亲链上所有节点对应的元素的高度设置为auto。
步骤S304、判断所述当前render节点对应的元素的逻辑宽度是否小于显
示终端的屏幕宽度或者所述当前render节点对应的标签是否为img标签；是则
转入步骤S305，否则转入步骤S306；
如图6所示，页面的元素可由盒模型表示，其中该元素在页面中所占的宽
度则为逻辑宽度，由左边界的宽度(margin-leftwidth)+左边框的宽度(border
-leftwidth)+左边框留空白的宽度(padding-leftwidth)+元素内容的宽度+
左边框留空白的宽度(padding-rightwidth)+左边框的宽度(border-right
width)+右边界的宽度(margin-rightwidth)组成。因此，先获取当前render
节点对应的元素各个部分的宽度(margin-leftwidth、border-leftwidth、
padding-leftwidth、width、margin-rightwidth、border-rightwidth、padding-right
width)，然后计算获得该元素的逻辑宽度。
当所计算的元素的逻辑宽度大于显示终端的屏幕宽度，则设置该元素的
高度为auto，即该高度将随元素的内容调整而变化。例如当该元素的逻辑宽
度大于显示终端的屏幕宽度，则该元素的内容无法完全显示在显示终端的显
示区域，此时则可以将该元素无法显示在显示终端的显示区域的内容显示在
下一行，从而将增加元素的高度。当所计算的元素的逻辑宽度小于显示终端
的屏幕宽度，则不做处理。
步骤S305、判断当前render节点对应的标签是否为img标签且当前render
节点对应的元素的高度为零，或者当前render节点对应的元素为float元素；是
则转入步骤S306；否则不做处理；
步骤S306、设置当前render节点对应的元素的高度为auto；
步骤S307、设置当前render节点对应的元素的最大高度和最小高度为
auto；
步骤S308、当当前render节点对应的标签为dl或者li标签时，若当前render
节点对应的元素的高度为fixed，设置当前render节点对应的元素的高度为
auto，然后清除所述当前render节点的父亲链上所有render节点对应的元素的
高度；
当当前render节点对应的标签为dl、li标签，且所述当前render节点对应的
元素的属性line-height为fixed，则设置当前render节点对应的元素的高度为
auto，即该元素的高度可以随实际的内容进行调整。然后，再清除当前render
节点的父亲链的高度，具体为，将父亲链上所有节点对应的元素的高度设置
为auto。
步骤S309、，清除所述当前render节点的父亲链上所有render节点对应的
元素的高度。
具体为：根据render节点的样式中的属性hasBackgroundImage的值来判断
是否有背景图。同时还将增加是否被清除的标记。例如，标记为0，则该背景
图没有被清除，标记为1，则该背景图被清除。因此，当当前render节点有背
景图且没有被清除时，将父亲链上所有节点对应的元素的高度设置为auto。
(三)行高规则
依次获得每个render节点的样式；其中包括当前render节点的属性及属性
值、该render节点的元素类型等等。然后按照预设的行高规则，对当前render
节点的样式进行判断，确定当前render节点的样式中是否需要进行行高调整，
若当前render节点的样式中需要进行行高调整，则进行相应的行高调整。
如图7所示，具体的行高调整过程可包括：
步骤S401、当所述当前render节点对应的元素为inline元素，或者所述当
前render节点对应的标签为img、button标签时，设置属性line-height为120％；
步骤S402、当所述当前render节点的属性line-height的值继承自所述当前
render节点的父亲节点，且为固定值，则设置所述当前render节点的父亲链上
所有render节点的属性line-height均为120％；
当当前render节点的父亲节点的属性line-height>0，且当前render节点的属
性line-height不为零时，表示当前render节点的属性line-height的值继承自所述
当前render节点的父亲节点。而且，当当前render节点的属性line-height的值为
固定值时，设置所述当前render节点的父亲链上所有render节点的属性
line-height均为120％。
步骤S403、当所述当前render节点的背景图被清除，且属性line-height的
值大于90％，则设置属性line-height为120％；
判断当前render节点的背景图是否被清除，当当前render节点的背景图未
被清除，则不做处理。当当前render节点的背景图被清除，且当前render节点
的属性line-height的值大于90％时，设置属性line-height为120％。
步骤S404、当所述当前render节点的属性line-height的值为固定值，且所
述当前render节点对应的元素为inline元素时，则设置当前render节点的属性
line-height为140％。
(四)flattern规则
当预设的样式规则包括flattern规则时，根据flattern规则调节render节点对
应的样式时，具体包括：
当所述当前render节点对应的元素为iframe元素时，对iframe元素进行
flattern(平坦化)处理，以使iframe中的内容全部展示出来。
(五)字体反色规则
当预设的样式规则包括字体反色规则时，根据字体反色规则调节render
节点对应的样式时，具体包括：
对当前render节点的文字属性进行反色处理。
由于背景图被过滤，因此需要对当前render节点的文字属性进行反色处
理，以使文字在显示终端的显示屏幕上显示。
(六)边框空白规则
当预设的样式规则包括边框空白规则时，根据边框空白规则调节render
节点对应的样式时，具体包括：
当所述当前render节点的属性padding的值大于一预设阈值时，将所述当
前render节点的属性padding的值设置为3-5像素。
(七)边界处理规则
当预设的样式规则包括边界处理规则时，根据边界处理规则调节render
节点对应的样式时，具体包括：
当所述当前render节点的属性margin的值大于一预设阈值时，将所述当前
render节点的属性margin的值设置为3-5像素。
(八)空格处理规则
如图8所示，当预设的样式规则包括空格处理规则时，根据空格处理规则
调节render节点对应的样式时，具体包括：
步骤S501、当所述当前render节点对应的元素的宽度及高度均为1像素，
则设置属性display为none；
步骤S502、当属性visibility为hidden，则设置当前render节点属性display
为none；
步骤S503、当iframe元素中没有内容，则设置当前render节点属性display
为none。
(九)显示属性调整规则
如图9所示，当预设的样式规则包括显示属性调整规则时，根据显示属性
调整规则调节render节点对应的样式时，具体包括：
步骤S601、当所述当前render节点对应的标签为table、tbody、tfoot、tr、
th标签，且属性display不为none时，设置当前render节点属性dsplay为block；
步骤S602、当所述当前render节点对应的标签为td标签，且属性display
不为none时，设置当前render节点属性dsplay为inline_block。
(十)输入框显示规则
当预设的样式规则包括输入框显示规则时，根据输入框显示规则调节
render节点对应的样式时，具体包括：
当所述当前render节点对应的标签为input，即当前render节点对应的元素
为输入框，则对该render节点的边框宽度、样式、颜色和圆角矩形进行相应
的调整。
进一步地，如图10所示，上述步骤S140可包括：
步骤S141、计算元素的最大允许宽度；
由于子元素的盒模型位于父亲元素的盒模型内，因此，计算当前render
节点对应的元素的最大允许宽度时，将结合当前render节点的父亲节点对应
的宽度来计算。具体为：如图11所示，最大允许宽度为父亲节点对应的宽度
-margin的宽度-padding的宽度-border的宽度之后的宽度。
步骤S142、当所述当前render节点对应元素为inline元素，且标签为img
标签、有背景图且未被清除，且当前render节点对应元素的逻辑宽度大于所
述最大允许宽度时，设置当前render节点对应元素的逻辑宽度为所述最大允
许宽度；
步骤S143、当所述当前render节点对应元素为float元素，且所述当前render
节点为右float，所述当前render节点的兄弟节点为左float时，重新计算当前
render节点对应元素的最大允许宽度；
步骤S144、当重新计算的最大允许宽度小于150像素或者所述当前render
节点对应元素为line元素时，设置当前render节点对应元素的逻辑宽度为元素
的逻辑宽度与最大允许宽度中较小的值。
对应方法实施例，本发明还提供了一种网页的显示处理装置，如图12所
示，该网页的显示处理装置包括：
页面数据接收模块110，用于接收服务器根据终端发起的页面访问请求而
返回的页面数据，且所述页面数据为web页面的数据；
页面数据解析模块120，用于对接收到的页面数据进行解析，并生成
render树，同时获得所述render树中所有render节点的样式；
样式调整模块130，用于按照预设的样式规则，对各render节点的样式进
行调整，获得各render节点最终的样式；
宽度调整模块140，用于按照预设的宽度规则，对各render节点对应的元
素的宽度进行调整，获得render节点对应的元素的最终宽度。
本发明实施例通过预先设置的样式规则以及宽度规则，分别对各render
节点的样式及对应的元素的逻辑宽度进行调整，从而使得页面可以在显示终
端的显示屏幕上自适应进行显示，不需要左右滚动页面，而且显示效果更佳，
甚至不会造成页面元素的丢失。
进一步地，预设的样式规则可包括背景图过滤规则、高度规则、行高规
则、flattern规则、字体反色规则、边框空白规则、边界处理规则、空格处理
规则及输入框处理规则等等。因此，如图13所示，上述样式调整模块130可包
括：背景图过滤子模块131、高度调整子模块132、行高调整子模块133、flattern
处理子模块134、字体反色处理模块135、边框空白处理子模块136、边界处理
子模块137、空格处理子模块138、显示属性调整子模块139。以下将对各样式
调整子模块根据相应的样式规则进行样式调整的过程一一描述。
上述背景图过滤子模块131用于：
判断当前render节点的属性text-indent是否小于零；
当所述当前render节点的属性text-indent小于零时，清除所述当前render
节点的父亲链上所有render节点的背景图；
当所述当前render节点的属性text-indent大于或等于零，且所述当前render
节点的属性display为block或table时，判断所述当前render节点是否有背景图
且没有被清除；
当所述当前render节点有背景图且没有被清除时，清除所述当前render节
点的背景图。
进一步地，上述背景图过滤子模块131还用于：
当所述当前render节点对应的元素为inline元素时，判断所述当前render
节点是否有背景图或者render节点的背景图没有被清除；
当所述当前render节点有背景图或者所述当前render节点的背景图没有
被清除时，设置所述当前render节点的样式属性text-indent＝0；
当所述当前render节点没有背景图、且所述当前render节点的背景图被清
除时，判断所述当前render节点的父亲节点的样式属性text-indent是否小于零；
当所述当前render节点的父亲节点的样式属性text-indent小于零时，设置
所述当前render节点的样式属性text-indent＝0。
上述高度调整子模块132用于：
当所述当前render节点对应的元素为inline元素或者所述当前render节点
对应的标签为img、button、input、i标签时，设置所述当前render节点对应的
元素的高度为最小高度；
当所述当前render节点的父亲节点的属性line-Height大于零时，清除所述
当前render节点的父亲链的高度；
当所述当前render节点对应的标签为dl、li标签，且所述当前render节点对
应的元素的高度为固定值时，设置元素高度为auto，并清除所述当前render
节点的父亲链上所有render节点对应的元素的高度；
当所述当前render节点没有背景图或者背景图被清除时，清除所述当前
render节点的父亲链上所有render节点对应的元素的高度。
进一步地，上述高度调整子模块132还用于：
当所述当前render节点对应的元素的逻辑宽度大于零且小于显示终端的
屏幕宽度时，设置当前render节点对应的元素高度为auto；
当所述当前render节点对应的标签为img标签，且元素高度为零或者所述
当前render节点对应的元素为float元素时，设置当前render节点对应的元素高
度为auto；
当所述当前render节点对应的元素的逻辑宽度大于显示终端的屏幕宽
度，且所述当前render节点对应的标签不是img标签时，设置当前render节点
对应的元素高度为auto。
上述行高调整子模块133用于：
当所述当前render节点对应的元素为inline元素，或者所述当前render节点
对应的标签为img、button标签时，设置属性line-height为120％；
当所述当前render节点的属性line-height的值继承自所述当前render节点
的父亲节点，且为固定值，则设置所述当前render节点的父亲链上所有render
节点的属性line-height均为120％；
当所述当前render节点的背景图被清除，且高度大于90％，则设置当前
render节点属性line-height为120％；
当所述当前render节点的属性line-height的值为固定值，且所述当前render
节点对应的元素为inline元素时，则设置当前render节点属性line-height为
140％。
上述flattern处理子模块134用于：所述当前render节点对应的元素为
iframe元素时，对iframe元素进行flattern处理。
上述字体反色处理模块135用于：对当前render节点的文字属性进行反色
处理。
上述边框空白处理子模块136用于：当所述当前render节点的属性padding
的值大于一预设阈值时，将所述当前render节点的属性padding的值设置为3-5
像素。
上述边界处理子模块137用于：当所述当前render节点的属性margin的值
大于一预设阈值时，将所述当前render节点的属性margin的值设置为3-5像素。
上述空格处理子模块138用于：
当所述当前render节点对应的元素的宽度及高度均为1像素，则设置属性
display为none；
当属性visibility为hidden，则设置当前render节点属性display为none；
当iframe元素中没有内容，则设置当前render节点属性display为none。
上述显示属性调整子模块139，用于：
当所述当前render节点对应的标签为table、tbody、tfoot、tr、th标签，且
属性display不为none时，设置当前render节点属性dsplay为block；
当所述当前render节点对应的标签为td标签，且属性display不为none时，
设置当前render节点属性dsplay为inline_block。
进一步地，所述宽度调整模块140用于：
计算元素的最大允许宽度；
当所述当前render节点对应元素为inline元素，且标签为img标签、有背景
图且未被清除，且当前render节点对应元素的逻辑宽度大于所述最大允许宽
度时，设置当前render节点对应元素的逻辑宽度为所述最大允许宽度；
当所述当前render节点对应元素为float元素，且所述当前render节点为右
float，所述当前render节点的兄弟节点为左float时，重新计算当前render节点
对应元素的最大允许宽度；
当重新计算的最大允许宽度小于150像素或者所述当前render节点对应
元素为line元素时，设置当前render节点对应元素的逻辑宽度为元素的逻辑
宽度与最大允许宽度中较小的值。
以上所述仅为本发明的优选实施例，并非因此限制其专利范围，凡是利
用本发明说明书及附图内容所作的等效结构或等效流程变换，直接或间接运
用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。