文字の超長は自動的に省略符のcssの書き方をプラスします

875 ワード

ネット上で大部分を見つけたのは、
overflow: hidden;
text-overflow: ellipsis;
width: 100px;
white-space: nowrap;
というcssは、tableのtdを指すものもあれば、spanを指すものもあります.しかし、直接持ってくるのは使いにくいようです.そこでまとめてみました.
1.tableのtdで
tableがこの目的を達成するには、まず、tableは必ずそのスタイルを設定しなければならない:table-layout:fixed;次に、指定したtdに上のスタイルを適用します.ここでwidthは必ずしも有効ではないことに注意してください.table-layoutがfixedに指定されている場合、tdの幅は最初の行の対応する列tdの幅にのみ影響されます.詳細については、w 3 c schoolを参照してください.http://www.w3school.com.cn/css/pr_tab_table-layout.asp
2.ブロックレベル要素
ここでなぜブロックレベルと言うのかというと、spanではaのような要素の中では有効ではないようだからです.彼らのdisplayをblockに設定しない限り.では、そのインライン特性を維持しながら、私たちの目的を達成する方法はありませんか.はい、いいです.この時inline-blockが役に立ちます.すなわち,a,spanのようなインライン要素に適用する必要がある場合は,追加的に加算する.
display:inline-block
というcssプロパティ.注意:inline-blockというcss属性にも互換性があるようですが、ここでは議論しません.詳細はグーグルでお願いします.
原文URL:http://sudodev.cn/articles/119.html