cssに関するasu555のブックマーク (2)

  • HTMLは非常にシンプル! 圧倒的な速さでMaterial Design 3のUIを実装できるCSSの超軽量フレームワーク -Beer CSS

    ここ数年で数多くのCSSのフレームワークが登場しました。BootstrapやBulmaをはじめ、Tailwind CSSなど、それらを使用したことがある人も多いと思います。 しかし、これらの人気が高いフレームワークはバージョンアップを重ねにつれ、肥大化と複雑さが問題点として挙げられます。 最近注目されているCSSの超軽量フレームワーク「Beer CSS」🍺を紹介します。シンプルで効率がよく、柔軟性もあり、アクセシブルで、セマンティックHTMLで記述します。 Beer CSS Beer CSS -GitHub Beer CSSの特徴 Beer CSSの使い方 Beer CSSのデモ Beer CSSUI要素とコンポーネント Beer CSSの特徴 Beer CSSは、デベロッパーにストレスを与えることなく、圧倒的な速さでMaterial Designのインターフェイスを構築できるCSS

    HTMLは非常にシンプル! 圧倒的な速さでMaterial Design 3のUIを実装できるCSSの超軽量フレームワーク -Beer CSS
  • CSSで見出し固定+レスポンシブ対応の表を作成

    CSSで見出し固定+レスポンシブ対応の表を作成料金表やサービスプランの比較、タイムテーブルなどなど、使う場面が多い割には制限も多く、初心者には少しとっつきにくいと思われがちな表。今回はあると便利な表の見出し固定やレスポンシブ対応の方法を紹介します。 見出しの行を固定する表の中の行が増えてくると、スクロールした時に表の見出しが画面から見えなくなり、なんの値だったのかがわかりづらくなります。そんな時のために、行数の多い表では一番上にくる見出しの行を固定しておくといいですね。 まずはベーシックな表を作成します。table タグに border-collapse: collapse; を指定することで、セル間のスペースがなくなってフラットな見た目になりますよ。 HTML <table> <tr class="heading"> <th>車体名</th> <th>価格</th> <th>燃費</th

    CSSで見出し固定+レスポンシブ対応の表を作成
  • 1