Discover Sass & Compass Extensions Find the perfect tool for your next Sass or Compass project. Add Your Own
Sache: Find Sass and Compass Extensions for your next project
Discover Sass & Compass Extensions Find the perfect tool for your next Sass or Compass project. Add Your Own
Polynode
For Web Design,Mini Games,Infographics.This is an app and its engine to create CSS3D Object from 3D Model.Polynode is licensed under Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License 2014 Polynode is made by Xpressive Team@Modulay.inc Special thanks @Codepen for the code export. @Tridiv for many technical inspirations.
CSSポストプロセッサー時代の到来
SassやLESSといったCSSプリプロセッサーは市民権を得たと言って良いと思う。しかしそれらCSSプリプロセッサーは開発という段階にのみ利をもたらすもので、今のところはそれ以上ではない。CSSを実際にユーザーに届けるまでには、開発だけではなくレビューとリリースという段階もある。レビューとリリースも確実性を持って効率的に行うためには、CSSポストプロセッサーと総称されるようなツール群が必要になるだろう。 この文書はFrontrend Advent Calendar 2013の4日目への記事として寄稿した。明日は@hilokiさんがスタコラサッサと書くようだ。 目次 CSSポストプロセッサーとは CSSプリプロセッサーの出力するCSS CSS Lint 開発用とレビュー用、リリース用のCSS CSSポストプロセッサーのユースケース ベンダー拡張プリフィックスの付加 Media Queries
StyleDocco
StyleDocco generates documentation and style guide documents from your stylesheets. Stylesheet comments will be parsed through Markdown and displayed in a generated HTML document. You can write HTML code prefixed with 4 spaces or between code fences (```) in your comments, and StyleDocco shows a preview with the styles applied, and displays the example HTML code. The previews are rendered in resiz
モダンなCSS設計パターンを考える
This document discusses modern CSS architecture patterns. It introduces concepts like OOCSS, SMACSS, and BEM for organizing CSS in a modular, scalable and maintainable way. It provides examples of how to build reusable CSS modules and maintain them through techniques like naming conventions, categorization and decoupling CSS from HTML. The presentation emphasizes goals of building predictable, reu
Lightning fast Sass compiling with libsass, Node-sass and Grunt-sass
The bigger the Sass project you work on, the slower compilation of your Sass project can become. That's because ordinarily Sass is Ruby based and there's never been a way around that. Until now. If you are interested in Libsass, you might be interested to read another post about migrating a code base from a Ruby based Sass compiler to Libsass? If so, take a look at ‘Is Libsass, the lightning fast
未使用CSSセレクタを見つけて削除する方法 - Qiita
サイトが大きくなればなるほど未使用セレクタとか増えちゃってCSSで余計な容量食っちゃったりしませんか？ そんな時に、ページごとに使っていないセレクタを見つけて削除したい。 いろいろ未使用セレクタを見つけるツールがあるみたいですが今回はChromeの開発ツールを使いました。 未使用CSSセレクタの見つけ方 Choromeの開発ツールのAuditsをクリックし、 Runボタンをクリック。 Remove unused CSS rulesを開くと そのページで使われていないCSSセレクタが一覧で表示されます。 未使用CSSセレクタの削除 あとは以下の手順で削除する。 他のページのviewやjavascriptでそのセレクタが使われていないか調査 使われていない場合は削除する 自分の環境だとRails使っているので grepかけて他で使ってないかチェックしてから削除します。 grep -r 'fb_
BEMという命名規則とSass 3.3の新しい記法 - アインシュタインの電話番号
BEMを使った命名がとても明快で、このところHTMLやCSSを書くのによく使っている。CSSのクラス名として書く場合は、BEMをCSS用に使いやすくしたMindBEMdingという書き方を採用している。最初にこれを知ったときは「こんな汚い記述の仕方は使いたくない」と思ってたんだけど、すっかり慣れて、今ではその明快さにちょっと心酔しかけているほど。 BEMの方法論とMindBEMdingのルールについてはそれぞれの文書を読んでもらうとして、それらをひっくるめて大雑把に説明すると、BEMとはBlock、Element、Modifierの頭文字を取ったもので、構成する要素をそのどれかに当てはめて命名していく方法。どの場合でも必ずBlockもしくはそのModifierがルートにあり、その中に、所属するElementもしくはそのModifierが含まれる構成になる。 Block - 構成のルートとな
目指せ！狩りガール
フツーのOLありちゃんがハンターになるまでの軌跡。狩りガールを目指したい方におすすめ！ 普段は東京でOLをしながら、週末は狩りガール。そんな3年目ハンターありちゃんの、狩りガールな日常をご紹介、 ［連載中］ 新米ハンターとして歩きだした狩りガールが、一人前のハンターになるため、ニッポン全国の狩猟の達人を訪ねる旅に――。 ［連載中］ 狩りガールは、つづくあり日記もとうとう最終回になりました。が、ありちゃんの狩猟はこれからも続きます。来シーズンももちろんですが、「有害鳥獣駆除」にも参加することになりましたよ。 みなさん短い間でしたが、ありがとうございました。また会いましょう！！ [記事を読む] 山の恵みたっぷり！ ～猟期の打ち上げ～今期の狩猟シーズンもありちゃんたちのチームは安全に楽しく終わることができました。山の神様やチームメンバーに感謝する「打ち上げ」も大事な節目です。ありちゃんも手料理を
Hayaku!
for Sublime Text 2Download from GitHubthrough Package ControlFuzzy abbreviationsWith hayaku you don't need to remember abbreviations and use cheatsheets. You can write just any way you like the abbreviations to be and Hayaku would try it's best to guess what you need. That way all those abbreviations are equal: oho:hovhioverfl:hidnFast valuesHayaku gives you a way to write numeric and color values
Getting started | Less.js
It's CSS, with just a little more. Use with Node.js: npm install -g less > lessc styles.less styles.css Or the browser: <link rel="stylesheet/less" type="text/css" href="styles.less" /> <script src="https://cdn.jsdelivr.net/npm/less" ></script> Or try the online playground ! 🆕 Less (which stands for Leaner Style Sheets) is a backwards-compatible language extension for CSS. This is the official do
RECESS
Overview Developed at Twitter to support our internal styleguide, RECESS is a simple, attractive code quality tool for CSS built on top of LESS. Incorporate it into your development process as a linter, or integrate it directly into your build system as a compiler, RECESS will keep your source looking clean and super managable. Tweet Installation Run the following line in your terminal: $ npm inst
メンテナブルCSS
概要 メンテナブルなCSSを目指し、定義された一般的なCSSルールの紹介と、それらのルールを適用するにあたって活用できるツールを報告します。 1. 序論 CSSは記述ルールが簡素であり、少しの学習コストですぐに記述ができる手軽なツールです。 しかし、大規模なアプリケーションで複数人で開発するケース等では、見栄えだけしか考えずに身勝手にコーディングしてしまうと、 非常にメンテナンスコストがかかる負の遺産が作られてしまいます。 そのためCSSの品質を保つために様々なプロジェクトで、CSSの定義ルールが決められています。 本稿では一般的なCSSの定義ルールと、そのルールがなぜ作られたのかを合せて報告致します。 また、CSSのルールを適用するにあたって、手動・目視でルールの適用をチェックするのは非常にコストが高い作業です。 これらルールの適用を補助するツール群を、合せて報告致します。
Pixel-free CSS
I recently redesigned my blog, The Sunday Best. In the process, I think I did something new: I completely avoided the use of px units in my CSS. I’ve been (badly) making websites since I was 14. In 1996, and indeed for most of the Web’s existence, makers of websites had to be very concerned about the average resolution of users’ screens. I felt safe stretching my sites to just under 800-pixels wid
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - sass/sassc: libsass command line driver
GitHub - tombenner/nui: Style iOS apps with a stylesheet, similar to CSS
Normalize.css: Make browsers render all elements more consistently.
UglifyJS — a JavaScript parser/compressor/beautifier
今必要なCSSアーキテクチャ
サービス終了のお知らせ