1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
| /*
| <div class="jimu-clamp-wrap">
| <div class="clamp">mult-line clap.</div>
| </div>
|
| PS: style padding should be set in wrapper
| */
| .jimu-clamp-wrap {
| height: 44px;
| line-height: 22px;/*clamp 2 line*/
| overflow: hidden;
| }
| .jimu-clamp-wrap .clamp {
| float: right;
| margin-left: -5px;
| width: 100%;
| word-break: break-all;
| }
| .jimu-rtl .jimu-clamp-wrap .clamp {
| float: left;
| margin-left: auto;
| margin-right: -5px;
| }
| .jimu-clamp-wrap::before {
| float: left;
| width: 5px;
| content: '';
| height: 44px;
| }
| .jimu-rtl .jimu-clamp-wrap::before {
| float: right;
| }
| .jimu-clamp-wrap::after {
| position: relative;
| float: right;
| text-align: right;
| content: "...";
| width: 4em;
| margin-left: -4em;
| left: 100%;
| padding-right: 5px;
|
| height: 22px;/*line height*/
| line-height: 22px;
| top: -22px;
| /*background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(white), color-stop(50%, white));
| background: -moz-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
| background: -o-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);
| background: -ms-linear-gradient(to right, rgba(255, 255, 255, 0), white 50%, white);*/
| background: linear-gradient(to right, rgba(255, 255, 255, 0), white 65%, white);
| }
| .jimu-rtl .jimu-clamp-wrap::after {
| float: left;
| text-align: left;
| margin-left: auto;
| margin-right: -4em;
| left: auto;
| right: 100%;
| padding-right: 0;
| padding-left: 5px;
| background: linear-gradient(to left, rgba(255, 255, 255, 0), white 65%, white);
| }
|
|