タグ

関連タグで絞り込む (2)

タグの絞り込みを解除

cssとSCSSに関するperstivetechのブックマーク (4)

  • Sass(SCSS)入門

    コーナーは、技術評論社発行の書籍『Ruby on Rails 4アプリケーションプログラミング』の中から、特にBuild Insiderの読者に有用だと考えられる項目を編集部が選び、同社の許可を得て転載したものです。 『Ruby on Rails 4アプリケーションプログラミング』の詳細や購入は技術評論社のサイトや目次ページをご覧ください。 前々回~前回は、CoffeeScriptの基礎解説しました。今回は「Sass(SCSS)」の基礎を説明します。 ■ 9.4 Sass(SCSS) Sass(Syntactically Awesome StyleSheets) は、いわゆるCoffeeScriptのCSS版とも言うべき存在で、CSSのコードを生成するための言語です。CoffeeScriptと同じく、Sassのコードもまた、CSSにコンパイルされた上で送出されますので、クライアント環境に

  • 自動検出と自動修正でCSSを保守する - Qiita

    CSSの保守に便利なcsscombとscss-lintについて説明します。 scss-lint scss-lintは、SCSSのコードから与えた設定に違反している箇所を報告してくれるツールです。jslintrubocopのSCSS版のようなものです。これをCI等で定期的に実行しておくことで、ルールに違反したコードの蔓延を防ぎます。 csscomb csscombはNode製のツールで、CSSのコードを与えた設定に従って自動で変換してくれるものです。scss-lintを初めて導入するときに利用すれば、大半の警告を自動で修正してくれるでしょう。但しCSSの文法しか解釈できないため、SCSSに適用すると失敗する場合があります。SCSSで書かれたファイルに対して適用してみたところ、@includeなどの文法は受理されるものの、@ifなどの文法を受理できないようです。しかしながら問題となるケースが

    自動検出と自動修正でCSSを保守する - Qiita
  • CSSをSASS(SCSS)に書き換えてみて思ったこと - Qiita

    はじめに 勉強のためhtml->haml、css->sassをやって見ようと思いまして今自分で作っているサイトを試しに単純な変換をしてみました。という話をメモ代わりに書きます。 ビルドはsublime textでやっています。 事前設定 sassの事前設定ですが、他に更に詳しく説明してくれてるSO NICEな記事がたくさんありますのでここでは割愛します。私は以下を参考にして設定しました。 http://book.scss.jp/about/c7/editor/st.html ※ちなみにこちらのわたくしkindleで買いました。HTMLを書くデザイナーの方々もわかり易い内容になってるんじゃないかと思います。 ※謎なんですが、私の環境だとpackage installerにcompassがなくて困ってる。でもなんか動いてるけど。 CSSからSASSのコンバートするサイトがあります 単純にcs

    CSSをSASS(SCSS)に書き換えてみて思ったこと - Qiita
  • Sass(SCSS)は難しくないよ!私なりの使い方をご紹介! | Tips Note by TAM

    Sass(※この記事ではSCSSを指します)やLESSといったCSSプリプロセッサがどんどんメジャー化しています。 しかし、私の実感としてまだまだ使っていない人も多いのではないか?と思っています。 導入が難しそう。書き方がわからない。CSS使えなくなってしまうの? 色々な疑問や不安があると思います。ですが、Sassはあなたが考えるほど難しくありません! わたしもSassを使い始めて、まだ半年とちょっとです。そんな私の使い方をご紹介したいと思います。 ※この記事では導入部やコンパイルの紹介はしません。 ※前提 Sassを書けば勝手にCSSをいい感じに書いてくれる!というものではありません。 まだCSSにちょっと自信がない人は、まずはCSSに慣れたほうがいいです。 どんな効率化ツールを使うときでも、根となる基礎はきちんと理解しましょう。 (1).scssファイル内にCSSを書く まずはここか

    Sass(SCSS)は難しくないよ!私なりの使い方をご紹介! | Tips Note by TAM
  • 1