The Blog | Welcome to Adobe BlogThe Blog | Welcome to Adobe Blog アドビのブログでは、Creative Cloud、Document Cloud、Experience Cloudの最新情報や役に立つ情報を紹介しています。
@extendを使うべき時、@mixinを使うべき時 | POSTD
(編注：2020/08/18、いただいたフィードバックをもとに記事を修正いたしました。) 私がクライアントからよく受ける質問に 「@mixinと@extend、それぞれどのような時に使うべき？」 というものがあります。 “引数を使わない@mixinは悪である”。 これは以前からある経験則です。同じコードを2つのインスタンスで重複させるだけの@mixinは不快でさえあります。しかし、@extendを使うべき時、@mixinを使うべき時、これらを見極めることにはもっと深い意味があるのです。 それでは詳しく考察していくことにしましょう。 私は普段、@extendは決して使わないようにとアドバイスしています。@extendには、一見したところ魅力的な特徴がたくさんあるのですが、注意しなければいけない点はそれ以上にあります。言ってしまえば 見かけ倒し だということです。 それでも@extendを使い
DOCSSA - The Ultimate Driving Machine
Are you looking to invest in the stock market but don’t know where to start? Trading apps are an excellent way for beginners and experienced investors alike to trade stocks, ETFs, and more from the comfort of their own smartphones. With the rise of mobile technology, trading apps have become increasingly popular for those looking to take control of their financial future. Whether you’re a seasoned
Sassオレオレリファレンス
このリファレンスについて 元は社内提出用に書いたレポートです。 レポートは１ページに全内容が入っていてだいぶ見辛いので、リファレンスらしい感じに作りなおしました。 （ついでにかなり加筆修正しています） 内容はSass公式サイトのリファレンスを忠実に翻訳したものではなく、構成などを再編集したオレオレ仕様になっております。 もし内容に間違いなどありましたらご一報お願い致します。 おことわり 筆者が重度のChromerなので古いブラウザには全く媚びない悪びれない仕様です。新しいブラウザで御覧ください。
Sass 3.2: Silent Classes // Speaker Deck
One of the frustrations of OOCSS concepts is the amount of presentational classes that need to be created and the method of applying them to the DOM. Sass has looked to address this issue first with Mixins, then Extends, each with their own issues of duplicated code or creation of unnecessary code. Sass 3.2 introduces the concept of 'silent classes' whereas standardized presentational classes ca
最近試している Sass の書き方
最近、Sass 3.2 (プレリリース版) を使って新しい書き方を模索しているんですが、その方向性に自信が持てないので、ちょっとさらしてみて反応を見ようという試みです。 まず基本的な方向として、以下のような考え方を参考にしています: なぜ @kotarok さんは mixin より extend を推すのか - mixi Engineers' Blog Sassの存在意義 - Weblog - hail2u.net Sassの存在意義への補足 - Weblog - hail2u.net マークアップに合わせてスタイルを書くのでもなく、スタイルに合わせてマークアップするのでもない、それぞれを適切に書いた上で結びつける、というようなことを僕なりにやろうとしています。スタイルの実装と、それらを利用するためのインターフェイスを分離する、みたいなイメージで、具体的には Placeholder (%)
Sass & Compass Introduction, maddesigns (Sven Wolfermann) #t3dd12
Modern Frontend Development with Sass & Compass Introduction tweet: @maddesigns #t3dd12 #sass Sven Wolfermann | maddesigns Who is the guy? Sven Wolfermann (34) Freelancer for modern frontend development (HTML5, CSS3, jQuery) from Berlin CSS3 Adventskalender 2010/2011 wrotes articles for T3N, PHP-Magazin and Webstandards-Magazin (new: Screengui.de) Certified TYPO3 Integrator Twitter: @maddesigns We
クックパッド流UIの作り方～サービスとユーザーを繋ぐもの〜 - クックパッド開発者ブログ
もっとサービスのデザインを良くしたい、UIが分かりやすいサービスを作りたい、というエンジニア向けの勉強会です。 創業者の佐野がcookpad.comを立ち上げて以来、クックパッドはUIデザインに非常に強いこだわりを持って、ものづくりを行ってきました。 その「こだわり」の一端をこの勉強会で共有し、みなさまと意見交換できる場にしたいと思っています。 ■発表内容/発表者 「UI/UXのためのSass〜技術面から考えるサービスデザイン〜」 池田 拓司 （＠tikeda） サービスデザイン部 デザイン・UIグループ 「密着！クックパッドiPadアプリ開発の100日間～クックパッドのUI改善プロセス～」 片山 育美 （＠monja415） サービスデザイン部 デザイン・UIグループ 「UIで変わるマネタイズ～今すぐできる3つのコツ〜」 高本 大輔（＠dsk1124） 会員事業部 ◆開催概要 日時：7/
スクリプトが無効の場合のスタイル
たとえばホームページのビジュアル要素など、いったん非表示にしておいてスクリプトでふわっとフェードインさせたい、みたいなことはよくある。そのとき非表示にする操作も JavaScript にやらせると一瞬見えてしまうことがあるので CSS で非表示化したいが、それだとスクリプトが無効の場合に何も表示されなくなってしまう… というような、スクリプトによる操作を前提にしたスタイルのフォールバックをどうするかという問題。 ここのところよく使っていたのは、JavaScript で html 要素の class 属性を操作し、それをもとに CSS を書くという手。Modernizr でも使われてるあれ。 (function () { var root = document.documentElement; root.className = root.className.replace(/\bno[-_]
Using CSS Preprocessors Effectively
Photo by Horst Gutmann I recently did a talk on css preprocessors at djangocon.eu. They did a good job at recording it so you can enjoy the talk even if you were not there. Links Video Slides Analyzing the talk The great thing about having a video is of course that I can analyze my performance. So here are my conclusions: Plus Dry mouth management went well except for the very end. Except for the
Using CSS Preprocessors Effectively
Using CSS Preprocessors effectively. Jonas Wagner Known for doing crazy and creative stuff Works as Software Engineer at local.ch One of Switzerlands biggest websites 3.1 mio unique clients Issues with CSS No variables No hierarchy Prefixes Sprites Lack of abstraction The Solution CSS Preprocessors. Choosing a Preprocessor Sass. Official implementation is in Ruby Two dialects scss and sass Sassy C
ファイルの変更を監視するプログラムと仲良くする - Qiita
このエントリーはGitアドベントカレンダーの九日目です。 昨日はaerealさんの「内容が空のファイルをインデックスに追加する」でした。git-addの-Nオプション、知らなかったんですが使えそう。 新規ファイルに暫く書き込んだ後で「あ、git-addしなくちゃ」って思うことが多いんです。そういう時に取り敢えず登録だけして、後で差分を見ながら他のファイルとまとめて整理してコミットできるようになる、というのは地味（失礼！）だけど強い。 さて、今日の話題は「ファイル変更を監視するプログラム」です。 例えばSCSSを使っている時、開発中はscss --watchやcompass watchでSCSSファイルを監視しながら作業していると思います（Rails以外はね）。ファイルを変更したらそれを検知して、コンパイルして、CSSを上書きしてくれる。 ところがGitでは、git-checkoutでブラン
Sass Vs. Less | CSS-Tricks
DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit! “Which CSS preprocessor language should I choose?” is a hot topic lately. I’ve been asked in person several times and an online debate has been popping up every few days it seems. It’s nice that the conversation has largely turned from whether or not preprocessing is a good idea to which one
markdboyd/holmes-on-SCSS · GitHub
README.mdHolmes for SCSS This project is an adaptation of the http://www.red-root.com/sandbox/holmes/ created by Luke Williams. What's new? There are three main differences from the original Holmes project: File format changed from regular CSS to SCSS Separated CSS rules into separate SCSS partials according to what "warning level" you want to display Added extra body classes in addition to "holm
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - idok/scss-lint-plugin: SCSS Lint plugin for intellij
GitHub - sds/scss-lint: Configurable tool for writing clean, consistent SCSS
null.ly - a really cool domain parked on Park.io
5509.me
5509.me
https://github.com/necolas/idiomatic-css/tree/master/translations/ja-JP
