単一の行をカット：
span {
display: inline-block; // 如果不是block元素，还需要设置这个。
width: 150px; // 超出的宽度
overflow: hidden; // 超出隐藏
text-overflow: ellipsis; //超出用省略号
white-space: nowrap; // 不换行
}マルチラインは切り捨て：
マルチラインカットは、いくつかの方法があり、
1：-webkit-ラインクランプを使用するのが最も簡単で、もちろん、唯一のWebKitのコアブラウザーで使用さとスタイルをクリックして展開し、カスタムサポートしていません。
p {
width: 400px; // 超过这个宽度
text-overflow: ellipsis; // 使用省略号
display: -webkit-box; // 必须使用这个
overflow: hidden;// 必须使用，超出隐藏
-webkit-line-clamp: 4; // 必需设置，
-webkit-box-orient: vertical; // 设置里面元素排列顺序
text-align: justify; // 里面问题排列方式
}2：それは疑似クラスを使用して、インタビューに答えるための方法です。。。原因を超えたかどうか、それが適用されるかを決定JSこれを使用することに、あなたはすでに知っているシーンのテキストの大部分という。しかし、インタビュアーはOOO、OOO、このアプローチには非常に満足していません
p{
position: relative;
height: 36px; // 面试官说这个是定死的，所以不灵活。。。感觉很奇怪啊，不是死的话，怎么知道什么情况溢出？
overflow: hidden;
line-height: 18px;
}
p::after{ // 这个是一直有省略号，所以需要js判断是否超出，如果超出的话，就加一个class。
content: '...';
position: absolute;
bottom:0;
right: 0;
}3：フロートは、非常に複雑で、......フロート時間の使用が浮くのは好きではない、省略記号は、DOMノードであるので、あなたは、カスタマイズ度の高いものとスタイルを追加することができます！
<div class="container">
<div class="content">腾讯成立于1998年11月，是目前中国领先的互联网增值服务提供商之一。成立10多年来，腾讯一直秉承“一切以用户价值为依归”的经营理念，为亿级海量用户提供稳定优质的各类服务，始终处于稳健发展状态。2004年6月16日，腾讯控股有限公司在香港联交所主板公开上市(股票代号700)。</div>
<div class="standard"></div>
<div class="more">...更多</div>
</div>規格が標準である場合には、その高さを超えると、彼らは省略記号が表示されます、コンテナが彼の最大の高さを超えて、コンテナで、それが隠されています。すべての3つのdivフロート：右、マージン左の内容は：その標準が左側に表示されるように、それを得るために、標準の幅を - 標準。
.container{
max-height: 54px; // 最大高度
overflow: hidden; // 超出隐藏
line-height: 18px; // 方便计算几行。。
font-size:12px;
}
.container div{ // 三个元素都设置float
float: right;
}
.content{
margin-left: -50px; // 这是第一个元素，由于他宽度是100%，所以需要给standard位置。
width:100%;
position:relative;
background: hsla(229, 100%, 75%, 0.5)
}
.standard{
width: 50px; //宽度随意， 需要与上面margin-left一样
height: 54px; // 超出这个高度会出现more元素
position:relative;
color:transparent;
background: hsla(334, 100%, 75%, 0.5);
}
.more{
width:50px; // 这个元素可自定义，宽度
height:18px;
position: relative;
left: 100%; // 确定位置,
transform: translate(-100%,-100%);// 确定位置
background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff 20%, #fff); // 这是使用渐变，因为more元素会覆盖住content元素。
}概要：直接フロート法は、カスタムスタイルを促進し、イベント、および互換性をリッスンするために使用され、完璧な一時的な解決策であることができます。それは〜ああ、直接使用することができ、オンラインで少し複雑ですが、
最後に、非常に複雑で、長い時間を見て、私はインターネットの多くは、直接使用することができると感じ、特別の十分な理解せず、結局、ない数年、内蔵されたプロパティが存在します。。。
誰もがあなたが乱雑フルスタックエンジニアによるフロントエンドエンジニア、さらには道になるため大量のリソースを共有するために、簡単で効率的かつ無料の学習に役立つために。フロントエンドエンジニアに必要な知識、（実際のケースを投影するゼロベースからの）いくつかのシニアフロントエンドの開発エンジニアは、動画を録画784783012未払いのシェア：私たちは、フロントエンドのフルスタック学習バックルqunをお勧めするためにここにいます。また、無料の学習リソース受ける
非効率性につながる学習を継続する自信に影響を与え、本当のスタート学習は必然的に開始するためにどこか分かりません。
しかし、最も重要なことは、私がキーテクノロジーを習得する必要があるかわからないで、頻繁に、ピット学習を強化多くの時間を無駄に終わる、それが効果的か、必要な資源です。