追記
id:kitsさんにブックマークコメントでご指摘頂いた点を修正しました。
ご指摘ありがとうございました!
本題
HTMLでclassを複数指定したときの挙動について id:ofsilvers に教えてもらったのでメモ。
classを複数指定したときに、同じパラメータが指定されていた場合はCSSで後に定義されたものCSSで詳細度が高いものが優先される。
classの指定した順序は関係ない。
HTML::MobileJpCSS とか HTML::DoCoMoCSS を見ていてなんで複数classの指定に対応しないんだろうとか思ってたけど、こういう理由なら対応したくないですね!
あるいは適当にmergeしつつ、重複した指定があったときは死ぬ。とかあっても良いきがする。
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8" /> <title>CSS test</title> <style> .blue1 { color: blue; } .green1 { color: green; } .green2 { color: green; } .blue2 { color: blue; } </style> </head> <body> <h1>CSS Test</h1> <p class="blue1 green1">green</p> <p class="green1 blue1">green</p> <p class="blue2 green2">blue</p> <p class="green2 blue2">blue</p> </body> </html>