エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
aria-current属性と一般兄弟結合子で作るステップUI | フロントエンドBlog | ミツエーリンクス
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
aria-current属性と一般兄弟結合子で作るステップUI | フロントエンドBlog | ミツエーリンクス
この記事はミツエーリンクス Advent Calendar 2020 - Adventarの21日目の記事です。 今回はCSSのお話で... この記事はミツエーリンクス Advent Calendar 2020 - Adventarの21日目の記事です。 今回はCSSのお話です。 CSSをうまく使うことができると 必要だと思っていたJavaScriptが不要になる HTMLが簡潔に書ける 場合があります。 そのことから私は日々CSSを書きながら「まだ気がついていない使い方があるのではないか」とその可能性に魅力を感じています。 特に静的に実装するのであれば、万人が触れる機会が多いHTMLの編集しやすさは意識したいところですね。 ステップUIをお題として一般兄弟結合子(~)の実用例をご紹介します。 加えてaria-current属性の使い方も少しだけご紹介できればと思います。 例えば、以下のような見た目のステップUIをスタイリングする場合は 一般兄弟結合子を意識しないと、次のようにclass属性をたくさん付与するマークアップになりそ