技術とかの雑なToday I Learnedメモ

-webkit-line-clamp

-webkit-line-clamp

【CSS】line-clampによる複数行テキストの省略 | ジコログ

line-clamp をやりたいと思って調べた。

現状まだ line-clamp だけでは使えないので -webkit-line-clamp とする必要がある。

"line-clamp" | Can I use... Support tables for HTML5, CSS3, etc

IE のことを考えなくてよくなったので使えるぞ〜うお〜と思っていたけど、まだ CSS3 で出てきているわけではないのね。

line-clamp を使いたい場合、

.hoge {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

のようにしなくてはならないみたい。

ベンダープレフィックスが必要なくなるときはいつくるのだろう。

ところで WebKit ってどこのレンダリングエンジンだっけというのをさっぱり忘れていた。

HTMLレンダリングエンジン - Wikipedia

WebKit は Apple が中心となって開発していて Safari などに使われている。

Blink は 2013 年に WebKit から分離して Google が開発していて Chrome や Edge に使われている。

当初、ChromiumはレンダリングエンジンとしてWebKitが用いられてきたが、他のWebKitを採用するウェブブラウザとは異なり、Chromiumはタブや拡張機能、アプリケーションごとに1つのプロセスとして動作するマルチプロセスの概念を持っており、これによるWebKitプロジェクトとのコミュニティの複雑化、ひいては全体的なイノベーションの速度が低下してきたという指摘がChromiumプロジェクト内で起きていた。

ほほう。

分離元のWebKit側は、V8の排除、JavaScriptCore以外の仕様の排除、描画ライブラリのSkiaの排除、GoogleのビルドシステムGYPの排除などが行われた。

分離したBlink側も、描画ライブラリはSkiaのみ[6]、ビルドシステムはGYPのみとなり、これにより450万行のソースコードを削除する。

ここらへん覚えておきたい。