Ellipsis 省略

使用说明

本框架使用纯css制作了4中省略方式:单行省略,两行省略,三行省略,超字数省略。

使用ax-ell类表示单行省略。

                            <div class="ax-ell">文字</div>
                        
中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。

多行省略

本框架使用了5种省略字号。注意,本着用纯css完成项目原则,由于低版本firefox对多行省略号不支持,需要用户升级到高版本可解决。

  • subject:标题18px,对应行高是28px。
  • title:标题16px,对应行高是22px。
  • body:简介14px,对应行高是22px。
  • des:简介14px,对应行高是18px。
  • ignore:小字12px,对应行高是16px。

使用ax-ell-subject类表示单行项目省略;使用ax-ell-2-subject样式表示两行项目省略;使用ax-ell-3-subject样式表示三行项目省略。

                            <div class="ax-ell-subject">文字</div>
                            <div class="ax-ell-2-subject">文字</div>
                            <div class="ax-ell-3-subject">文字</div>
                        
中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。

使用ax-ell-title类表示单行正文省略;使用ax-ell-2-title样式表示两行正文省略;使用ax-ell-3-title样式表示三行正文省略。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。

使用ax-ell-body类表示单行正文省略;使用ax-ell-2-body样式表示两行正文省略;使用ax-ell-3-body样式表示三行正文省略。

                            <div class="ax-ell-body">文字</div>
                            <div class="ax-ell-2-body">文字</div>
                            <div class="ax-ell-3-body">文字</div>
                        
中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。

使用ax-ell-des类表示单行简介省略;使用ax-ell-2-des样式表示两行简介省略;使用ax-ell-3-des样式表示三行简介省略。

                            <div class="ax-ell-des">文字</div>
                            <div class="ax-ell-2-des">文字</div>
                            <div class="ax-ell-3-des">文字</div>
                        
中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。

使用ax-ell-ignore类表示单行小字省略;使用ax-ell-2-ignore样式表示两行小字省略;使用ax-ell-3-ignore样式表示三行小字省略。

                            <div class="ax-ell-ignore">文字</div>
                            <div class="ax-ell-2-ignore">文字</div>
                            <div class="ax-ell-3-ignore">文字</div>
                        
中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。
IE不支持多行省略。

参数汇总

类样式 说明
ax-ell 默认单行省略,跟随父层的字号和行高;
ax-ell-2 默认两行省略,跟随父层的字号和行高;
ax-ell-3 默认三行省略,跟随父层的字号和行高;
ax-ell-subject 项目单行省略,字号18px,行高28px;
ax-ell-2-subject 项目两行省略,字号18px,行高28px;
ax-ell-3-subject 项目三行省略,字号18px,行高28px;
ax-ell-title 标题单行省略,字号16px,行高22px;
ax-ell-2-title 标题两行省略,字号16px,行高22px;
ax-ell-3-title 标题三行省略,字号16px,行高22px;
ax-ell-body 主体单行省略,字号14px,行高22px;
ax-ell-2-body 主体两行省略,字号14px,行高22px;
ax-ell-3-body 主体三行省略,字号14px,行高22px;
ax-ell-des 简介单行省略,字号14px,行高18px;
ax-ell-2-des 简介两行省略,字号14px,行高18px;
ax-ell-3-des 简介三行省略,字号14px,行高18px;
ax-ell-ignore 小字单行省略,字号12px,行高16px;
ax-ell-2-ignore 小字两行省略,字号2px,行高16px;
ax-ell-3-ignore 小字三行省略,字号12px,行高16px;
ax-ell-more 自定义字数省略,默认60个字符;

超字数省略PLUGIN

使用ax-more-ell类表示超字数省略。默认显示60个字,简单使用data-num属性可以控制显示字数。

                            <div class="ax-more-ell" data-num="">文字</div>
                        
中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。

中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。中国疆域辽阔、民族众多,先秦时期的华夏族在中原地区繁衍生息,到了汉代通过文化交融使汉族正式成型,奠定了中国主体民族的基础。后又通过与周边民族的交融,逐步形成统一多民族国家的局面,而人口也不断攀升,宋代中国人口突破一亿,清朝时期人口突破四亿,到2005年中国人口已突破十三亿。

另外用户可通过js进行参数设置。根据自己需要设置字符长度,除了字符长度之外还可以设置“更多”按钮的文字和样式,使用方法如下:

                            <script type="javascript">
                               $(document).ready(function () {
                                   $("#div").axEll({
                                      textLength: "60",
                                      foldText: "收起",
                                      unfoldText: "全部",
                                      btnClass: "ax-color-primary",
                                   });
                              });
                            </script>
                        

参数汇总

名称 类型 默认值 说明
textLength string 60 默认60个字符;等同于data-num=''属性;标签属性优先,js属性次之,建议不要叠加使用。
foldText text 收起 展开时候的指示文字,等同于标签data-fold=''属性;标签属性优先,js属性次之,建议不要叠加使用。
unfoldText text 全部 折叠时候的指示文字,等同于标签data-unfold=''属性;标签属性优先,js属性次之,建议不要叠加使用。
btnClass string ax-color-primary 指示文字的类名,等同于标签data-class=''属性;标签属性优先,js属性次之,建议不要叠加使用。