タグ

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

タグの絞り込みを解除

sassに関するedo1のブックマーク (8)

  • 「Compass」、基礎から応用まで! | 株式会社LIG

    こんにちは、デザイナーの王です。 今回の記事ではCompass使いになるための必要最小限の知識から応用まで、体系的にひと通り紹介していきます。 全くの初心者でも問題ありません! はじめに結論を言うと、CompassでCSSを書くと 早い! 見やすい! メンテしやすい! コード量がぐっと減る! 一度使い出したら最後、もう元には戻れない! 一体どこまで便利なのかずらずら書くよりも、百聞は一見にしかず! 簡単なプロジェクトを通して、各特徴について紹介した短いデモ動画を用意したので、まずはこちらを見てください! Compassとは? Compassを語る前に、まずは「Sass」を知っておく必要があります。なぜなら、CompassはSassを元に開発したフレームワークだからです。 Sassとは では「Sass」とは何かと言うと、正式名称は「Syntactically Awesome Style Sh

    「Compass」、基礎から応用まで! | 株式会社LIG
    edo1
    edo1 2013/03/30
  • CSSライブラリ化? Sass(scss)のインストール方法 mac

    このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。 web帳 なんだか色々と出てきますよね。 もう、最近良く分かんないないです(笑) ではSassのインストール、使い方を紹介していこうと思っております。 Sass公式サイト http://sass-lang.com/ そもそも、Sassって何?って話なんですが、 SassとはCSS を生成するためのメタ言語です。 メンテナンス不能な状態に陥りがちのCSSをSass を使うことによって 上手い具合に構造化して記述することができます。 Sassという言語でcssを記述し、通常のcssとして吐き出すことが出来ます。 管理時は関数として扱い、使用する際に通常のcssと使用するイメージですかねぇ。 関数として扱ったり、 構造化して記述も可能。 1.Ruby Sassを利用するには、Rubyが必

    CSSライブラリ化? Sass(scss)のインストール方法 mac
    edo1
    edo1 2013/02/18
  • 【CyberAgent】技術情報/TechReport - テックレポート/Sass 3.2 オレオレリファレンス | 株式会社サイバーエージェント

    概要 CSSのメタ言語 Sass(Syntactically Awesome StyleSheets) について、心を込めて語ります。 2012年8月に重要な新機能を含んだバージョン3.2のアップデートがあったので、 既に使っている人への新機能紹介も兼ねています。 Web版はこちら http://tenderfeel.github.com/SassReference/ 目次 はじめに 2年前くらいはまだCSS3のモジュールなどは趣味レベルでしか使えないマニアックなものでしたが、 スマホが幅を効かせるようになってからというもの、CSSを使う環境は随分と様変わりしています。 ブラウザがLevel3のモジュールに対応するようになると、CSSで出来ることが増えるのと引き換えに、表現するための記述は複雑なものになりました。 ただでさえスタイルシートファイルが巨大化傾向にあるのに、メンテナンス

    edo1
    edo1 2013/02/06
  • 【Sassを覚えよう!Vol.4】Sassの基本的な記述方法

    前回のエントリーで、無事にSassが動作する環境が整ったかと思います。 今回は、いよいよ通常のCSSでは出来なかったSassの記述(Sass記法)に関してです! まずは基って感じですが、これだけでも十分Sassを利用することでコーディングの効率が上がる!って思ってもらえれば幸いです>< 記法の前に Sass記法の前に、SassはCSSの「完全な上位互換」と言えるので、CSSのルールはすべてそのまま利用することが出来ます。 その為、cssファイルをそのまま拡張子だけ .scssに変更して変換(コンパイル)し直すみたいな事も可能です。(圧縮できる程度のメリットしか有りませんが) 軽く余談ですが、このCSSとの完全な互換性が従来のSassには無かったのですが、現行のバージョンではそれが出来るので、余計な事を覚える必要がなく、Sassの機能を今までのCSSの知識にプラスアルファとして使えるんです

    【Sassを覚えよう!Vol.4】Sassの基本的な記述方法
    edo1
    edo1 2012/08/17
  • Sass - チュートリアル

    この文書は古いSassウェブサイトに載っていたチュートリアルの訳で、2013年12月現在もう新しいウェブサイトには存在しません。新しいウェブサイトでのチュートリアルにあたるSassの基の日語訳を参照してください。 Translation of: Sass - Tutorial Ruby と Sass のインストール まず、Sass がちゃんと動作するようにします。OS X を使用しているのなら、既に Ruby がインストールされているでしょう。Windows ユーザーならば RubyWindows インストーラーで、Linux ユーザーならパッケージ・マネージャーでそれぞれ Ruby をインストールすることが出来ます。 Ruby のインストールが完了したら、以下のようにして Sass のインストールを行います: gem install sass 最初の Sass スタイルシート 非

    edo1
    edo1 2012/08/16
  • Introduction to Sass and How to Setup with Mac + Coda

    2014年7月31日 CSS, 便利ツール 「Sass」って聞いたことありますか?すっごく簡単に言うと、CSSをもっと便利に・効率良く記述するためのものです。とは言え基的な書き方はCSSと同じなので、「新しいプログラミング言語」というより「CSSの新しい装備品」といったところでしょうか。一見難しく思えるかもしれませんが、慣れると「これなしではいられない!」とまで思えるSassの魅力と、Macでの設定方法はあまり見ないなーという事でMac+Codaでの設定方法も紹介します。 ↑私が10年以上利用している会計ソフト! Sassとは 日語では「サス」と読まれるようです。拡張子は「.scss」。今までのCSSに変数や計算式を使ったプログラミング風の書き方を加えた .scss ファイルを、変換(コンパイル)してCSSファイルを作成します。例えば「style.scss」のSassファイルを変換する

    Introduction to Sass and How to Setup with Mac + Coda
    edo1
    edo1 2012/06/26
  • オリジナルフォントが作れるiPad用フォント作成アプリ「iFontMaker」|linker journal|linker

    The domain name Linker.in is for sale A great idea deserves a great domain name!

    オリジナルフォントが作れるiPad用フォント作成アプリ「iFontMaker」|linker journal|linker
    edo1
    edo1 2011/01/20
  • SassでCSSの弱点を克服しよう (1/2)- @IT

    maedana SonicGarden SUG(SKIP User Group)/日Hamlの会 2009/5/22 Railsを使ったWebアプリケーション開発で、プログラマやデザイナを悩ませるものの1つがスタイルシートの記述だろう。Sassを使って、“クールで構造化された”スタイルシートを記述してみよう(編集部) Sassとは、Syntactically Awesome StyleSheetsの頭文字を取ったものです。あえて日語に訳すと、「かっこいい構文のスタイルシート」といった感じでしょうか。 もう少しシンプルに表現すると「クールなCSS(Cascading Style Sheets)」でもいいかもしれません。Sassはスタイルシートを簡潔に表現するためのメタ言語であり、同時にSassからCSSを生成するための便利なライブラリやコマンドラインツールを提供します。 Sassを使うと

    edo1
    edo1 2011/01/20
  • 1