分12今までの例では変数に色(カラーコード)やpxなどの数値を宣言して扱っていました。前述のカラー関数やMath関数で変換や計算ができるものです。LESSでは通常の文字列も変数に代入することができます。「CSSで文字列?」と思われるかもしれませんが,urlやcontentなど,文字列の出現頻度は意外と高いものです。CSSの概念からかなり外れた話なのでちょっと難しいかもしれませんが,文字列の宣言から編集の仕方まで,ポイントを1つずつ見ていきましょう。文字列を宣言するときの注意点まずは文字列としてそのまま出力されわかりやすい,contentプロパティを用いた例を見てみましょう。'@foo';「var」という文字列を「@foo」で宣言してcontentの中に入れると,どのように表示されるでしょうか?想定としては以下のように生成されてほしいですね。'var';しかし実際は,以下のように「@foo」とそのまま出力されてしまいます。'@foo';これは,他のプログラム言語と同様に,「'(シングルクォーテーション)や"(ダブルクォーテーション)で囲ったものは,すべて文字列として扱う」というルールがLESSに存在するからです。そのため,contentのように文字列を挿入する場合に「'」また「"」が必須な箇所にそのまま@fooなどの変数を入れると,変数もそのまま文字列として生成されてしまうのです。「'」や「"」の中で変数の値を利用したい場合は,下記の@fooのように,変数名を{}で囲っててください。'var';変数とプロパティ値,双方に「'」か「"」を付けるじつは,LESSでは他プログラミング言語のように,明確に数値や文字列を分けて宣言する必要がありません。文字列に'(シングルクォーテーション)や"(ダブルクォーテーション)をつけなくてもエラーは出ず,そのまま生成できます。そのため,前述の文字列宣言は,下記のように書いても同じ結果となります。//代わりにcontent側で「'」を付けてやるちなみにこれらの例を見ると,一番始めの変数でもcontentでも「'」を付けている場合は,「⁠'」が二重に付いてしまいそうです。,「⁠'」で括ると「文字列として認識する」という意味であり,適宜LESSが判断するので問題ありません。LESSの公式サイトでは,変数とプロパティ値,双方に「'」か「"」を付ける方法が推奨されています。CSSやJavaScriptの背景などを考えても,LESSの推奨ルールに従ったほうが良いでしょう。セレクタ名に変数を使えるのか今回,変数で文字列を宣言する方法をご紹介しましたが,このセレクタ名を変数で指定できるのでしょうか?たとえば下記のように,@varでdivタグを宣言して,実際のセレクタの指定箇所に@varを書いてみるとどうなるでしょうか。red;}結論から言えば,LESSではこういった宣言はできません。LESSでは「変数は値としてしか利用できない」という明確なルールがあるためです。変数は,セレクタだけでなく,プロパティ名としても利用できません。これらはLESSのライバルであるSassでは利用できる機能であるだけに,少し残念ですね。著者プロフィール宇野雄(うのゆう)UI・UXデザイナー。ヤフー株式会社にて,主にスマートフォンWebとアプリのUI・UX設計/デザイン/コーディングを担当。新しいモノづくりよりも,既にあるモノを新しい視点でとらえるデザインが好き。2019」を開催しました。DAY1・DAY2の様子を注目セッションとともにお伝えします。LINEのエンジニア3名がイベントに先駆けて見どころを紹介します。コードの安全性・安定性を高める開発サイクル~テスト管理の効率を上げ,脆弱性診断を自動で行う~本連載では,連載「業務を改善する情報共有の仕掛け」を受けつつ,安全性・安定性を加えた開発サイクルについて考えていきます。若者世代から圧倒的な人気を誇るライブ配信&動画投稿コミュニティアプリ「MixChannel」(ミクチャ)の裏側(レコメンドシステムやサーバサイド開発など)について解説していきます。その他の連載CSS3アニメーションでつくるインターフェイス表現CSS3によるアニメーション表現を紹介していきます。その中でも,幅広い読者に応用してもらえるだろうインターフェイスを主なお題とします。MySQL道普請便り本連載では,MySQLを使ったアプリ開発・運用に関するノウハウをご紹介していきます。RecipeUbuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。JavaScriptセキュリティの基礎知識JavaScriptに関するセキュリティ上の問題はどこで発生し,どうすれば防ぐことができるのか?について解説していきます。〜システムをきちんと運用するための基礎知識システムは「作って終わり」ではなく,運用の中でさまざまな問題が発生します。問題の発生に備えて事前にどのような対応をしておくべきなのか,問題発生時に何をしなければならないのか,ポイントを解説していきます。きたみりゅうじの聞かせて珍プレーソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。Linuxのメンテナンスの傍ら,Linuxやオープンソースソフトと日々を過ごす著者が,その魅力とつきあい方を,エッセイ風味でお届けします。PRESS特別編集部員,さわやか笑顔のスーパーハカーはまちちゃんとネット大好き14歳わかばちゃんが,毎号,読者の皆さんから寄せられたおたよりを紹介します。皆さんの日頃の悩みにも答えちゃいますよ。]メールでのお知らせメールで次の案内をお送りしております。メールの配信を希望する方は,利用したい項目をチェックしてメールアドレスを入力し,[登録]ボタンをクリックしてください。UPDATES[ほぼ週間に1回]新刊メールマガジン[ほぼ週間に1回]電脳会議の各号案内[ほぼ1ヵ月半に1回]※変更する場合や停止する場合は,登録情報変更ページをご覧ください。※登録いただいたメールアドレスには,そのお知らせ以外,配信いたしません。Ltd.ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。