Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                

タグ

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

タグの絞り込みを解除

SCSSに関するasiamothのブックマーク (5)

  • Sass で Singleton を実現し、安心してクラスを再利用する | nodot

    この article は Less & Sass Advent Calendar の23日目のエントリーとして書かれています(あれれ?!)。 概要 CSSメタ言語を導入する目的の一つにリソース再利用性の実現というものがある。Sass の場合、mixin や extend によって実現している。特に extend によるスタイルの継承は強力である。 しかし再利用できるようなクラスをまとめたライブラリを import して利用すると、実際には使われていないクラスも出力されてしまい、ファイル容量が無駄に肥大する。使うクラスだけコピーするとか、使わないクラスは削除するなどの手動管理は手間がかかる。 そこでクラス自体を出力するような mixin を作れば、必要なクラス定義だけを include でき、不要な CSS コードを出力しなくて済む。しかし、extend したいクラスを必要になる度に inc

    asiamoth
    asiamoth 2011/12/26
    @extend は誤爆がこわくて使いにくいです。。 たんに要素をカンマ区切りでつなげばいいような気がするし、CSSTidy の縮小で まとめられるし。
    リンク

  • (S)CSSの書き方メモ

    HTML5時代に向いていそうな(S)CSSの書き方を模索しています。SCSSで書くのでモジュール式に色々分割した方が良さそうだな……とか色々試してますが、なかなかこれ！　というものに辿りつけません……。ということで、ここ最近の書き方をメモがてら晒してみる試みです。 実際にこのサイトで使っているSCSSファイルを抜粋しつつ列記していきます。 style.scss style.cssになるSCSSファイルではCSSは書かないようにします。ただし例外としてCSS文法での@importルールはその必要性からここに書きます。Webフォントなんかで使いますね。それ以外はSCSSの@importでモジュール化した各種SCSSファイルを読み込んでいきます。 @import url("http://fonts.googleapis.com/css?family=Pacifico"); @import "va

    (S)CSSの書き方メモ
    asiamoth
    asiamoth 2011/10/26
    ものすごく参考になりました！ SCSS マニア垂涎（ごくり……）です！ でも、ちょっと分割しすぎかも？ 自分は styles.scss を SASS に監視させているので、ここに書き足しています。
    リンク

  • TIGER189: Link Daftar ID Game Online tiger 189 Terkuat di Bumi!

    TIGER189: Link Daftar ID Game Online tiger 189 Terkuat di Bumi! Selamat datang di TIGER189! Selamat datang! Di tiger189 sebuah situs resmi terpercaya games online dan sangat popular! Daftarkan diri anda dengan kesempatan saat ini! dan jangan lewatkan kejutan kejutan lain yang dapat diberikan pada situs ini ikuti terus informasi nya!

    TIGER189: Link Daftar ID Game Online tiger 189 Terkuat di Bumi!
    asiamoth
    asiamoth 2011/07/21
    CSS を動的に編集できるサービス。 ──ということよりも、SCSS を扱えるほうがすごい！ この便利さを分かる人は、ウェブ業界に何人いるだろう……。SASS, SCSS を知らないのはヤバいでぇ。
    リンク

  • はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知

    はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28

    はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
    asiamoth
    asiamoth 2011/03/21
    SCSS の実践的な使い方を解説。重要なことは、(X)HTML を変更せずに、デザインを*かんたんに*変えられるということ。CSS フレームワークはあくまでもその参考にする──という考え方が面白いな。
    リンク

  • Sass - チュートリアル

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

    asiamoth
    asiamoth 2011/03/21
    Sass （というか SCSS）の使い方を紹介したページ。CSS に慣れた人だったら、一度は触れておいたほうが良いと思う。たとえば Xyzzy だったら、CSS+-mode でサクサクと編集できるよ！
    リンク
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.