縦列に対してスタイルを適用するための方法や、行や列のハイライト表示、データセルのソートなど、jQueryを使ったデザインサンプルを紹介します。 対象読者 (X)HTMLとCSSの基本を理解している方。 デザインのコツを学びたい方。 必要な環境 本連載で動作確認を行ったブラウザは次のとおりです。 Windows 7 Internet Explorer 11 Windows 7 Firefox 26 Windows 7 Chrome 32 テーブルの縦列をスタイリングする HTML上では、セル(th/td)は列ではなく、横行(tr)の子孫要素になっています。そのため、スタイリングの対象として横列を操作するのは比較的簡単ですが、縦列を操作する場合には、ちょっとした知識が必要になります。 テーブルの縦列をマークアップする テーブルの縦列を構造的な意味でグループ化したい場合には、colgroup要素
![デザインサンプルで学ぶCSSによるスタイリング~「テーブル(ハイライト表示/縦列のスタイリング)」編](https://cdn-ak-scissors.b.st-hatena.com/image/square/b98aad3341ad265595708f85554c4872cc3f2e15/height=288;version=1;width=512/https%3A%2F%2Fcodezine.jp%2Fstatic%2Fimages%2Farticle%2F7844%2F7844_arena.png)