プログラム自学案内の7回目です。前回の記事ではCSSファイルとCSS属性のいくつかを紹介しました。今回はCSSセレクタ（CSS Selector）を案内します。CSSセレクタのコーディングには、パズル的なところがあり、意外と面白いです。 準備：簡単なHTMLファイルと空 ...

CSS 2.1と比べて、CSS 3には多数のセレクタが追加されている。そのひとつに属性セレクタがある。CSS 2.1では完全一致による指定しかできなかったが【1】、CSS 3では部分一致での指定が可能になった【2】。これにより、リンク先がPDFファイルの場合にPDF ...

今までカードゲームの製作過程を紹介してきましたが、ついにカードゲーム自体の紹介をしたいと思います！ 「あのCSSセレクタに上書きされたんだけど」はどんなゲーム？ Webページのスタイルを指定する仕組みであるCSSをテーマにしたカードゲームです。

スタイルの適用先を指定する「セレクタ」には、様々な条件で対象を絞り込める書き方が用意されています。うまく活用すれば、いちいちHTML側にclass属性やid属性で名前を割り振らなくても、CSS側だけで柔軟に適用先を限定できます。 です(※)。「セレクタ ...

CSS3で追加されたセレクタによって、CSSをより簡単に記述できるようになった。 ここでは従来のセレクタの概要をおさらいしつつ、CSS3で追加されたセレクタについて解説しよう。 CSSセレクタとは、スタイルを適用する範囲を指定するものだ。 CSSで指定 ...

CSSの「セレクタ」の書き方 再入門（CSS3対応版）(2ページ目) スタイルの適用先を指定する「セレクタ」には、様々な条件で対象を絞り込める書き方が用意されています。うまく活用すれば、いちいちHTML側にclass属性やid属性で名前を割り振らなくても、CSS側 ...

はじめまして！ サイボウズ フロントエンドエキスパートチームの麦島です。 本連載では、Webフロントエンドに関してもう一歩踏み込んだ知識について、サイボウズ フロントエンドエキスパートチームのメンバーによって不定期で解説記事を掲載していき ...

こんにちは！ サイボウズ フロントエンドエキスパートチームの麦島です。 CSS Modern Features、今回取り上げるCSSの機能はCSS Nesting Moduleです。 CSS Nesting Moduleは、CSS定義のネスト （入れ子） 記述を可能とする新しいCSS構文です。CSSのネストはSassやPostCSSといった ...