Screen
Screenは必要最低限だけを揃えた、使いやすいミニマルなCSSフレームワークです。
無駄な装飾もなく、軽量で、classを直感的にスタイルする事ができる命名規則を採用しています。
ただ、reset.css、inter.css、Googleフォントがimportされてるので不要なら削除してください。
使い方など
サンプルをご覧頂ければ把握できる設計です。基本的にはタグのみで期待するスタイルになります。
更に、同様のスタイルをclassでも使えるようにされているのが印象的でした。
例えばh1なら
< h1 >見出し</ h1 > |
と同じスタイルを
< span class = "h1" >見出し</ span > |
でも出来るようになっています。これは全てではありませんが、多くのタグに設定されているようです。
h 1 , .h 1 { line-height : 1.1 ;} h 2 , .h 2 { line-height : 1.3 ;} h 3 , .h 3 { line-height : 1.4 ;} hr, .hr { display : flex ; align-items : center ; text-align : center ; border : none ; margin : unset; margin : 23px auto 24px auto ; } |
ファイルサイズは非圧縮でも5kbほど。勿論RWD対応となっています。なかなかよさげでした。ライセンスはMITです。