• CSS Properties
  • text-overflow
​x
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<style>
5
    .ex1 {
6
        white-space: nowrap;
7
        width: 140px;
8
        overflow: hidden;
9
        text-overflow: clip;
10
        border: 1px solid #00ab55;
11
    }
12
    .ex2 {
13
        white-space: nowrap;
14
        width: 140px;
15
        overflow: hidden;
16
        text-overflow: ellipsis;
17
        border: 1px solid #ff4842;
18
    }
19
    .ex3 {
20
        white-space: nowrap;
21
        width: 140px;
22
        overflow: hidden;
23
        text-overflow: "---";
24
        border: 1px solid  #ffc107;
25
    }
26
</style>
27
</head>
28
<body>
29
​
30
<h1>The text-overflow property</h1>
31
​
32
<p class="ex1">text-overflow: clip (default):</p>
33
<p class="ex2">text-overflow: ellipsis:</p>
34
<p class="ex3">text-overflow: "---" (user defined string)</p>
35
​
36
</body>
37
</html>