最近のCSS

CSSの設計理念

CSS設計理念の例:段組組版

columns: 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
columns: 15em
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

CSSの設計理念:詳細

参照:fantasaiより「Designing CSS

CSSのシステム化

CSSのシステム化

Logical Properties

Alignment

CSSのシステム化:詳細

参照:Rachel Andrewより「Refactoring (the way we talk about) CSS

CSSデザインシステム最近の追加

Sub-grid

アスペクト比

自動分割

組版・タイポグラフィー

完成:
Variable Fonts
微調整中:
改行・空白調整ビデオ
分かち書き
これから:
ドロップキャップ
行幅調整
行どり
文字詰め処理

その他の最近のCSS

円錐勾配

CSS Color Adjustment

読者の好み(もしくは障害)に配色を合わせる

CSS Containment

速度最適化しやすいモードに選択

最近のCSS