kyaidoのブックマーク - はてなブックマーク

» gulp-autoprefixerよりもいい感じ。gulp-pleeeaseを使ってcssを処理しよう | isee ウェブに関するブログ
gulp-autoprefixerよりも高機能なgulp-pleeeaseの紹介。いろいろやってくれるとても良いやつ。gulp-autoprefixerはもう古いかも? css3を使ってスタイルを記述する際にベンダープレフィックスを自動で付けてくれるgulp-autoprefixer。とても便利ですよね。しかし、gulp-autoprefixerよりも高機能でいい感じなのが、pleeeaseです。pleeeaseはベンダープレフィックスを付けてくれるだけでなく、cssのminifier(圧縮)、mqpacker(メディアクエリをまとめる)、remのpx変換などをいっぺんに処理してくれます。 gulpで簡単に使うことができるので、早速導入してみましょう。 gulpって??という方→GulpでSassのコンパイルとlivereloadをやってみる gulp-pleeeaseのインストール
kyaido 2014/06/11
gulp
リンク
» 高さで文字数を制限するプラグイン[textCut.js]を作ってみる | isee ウェブに関するブログ
textCut.js まずは、仕様やオプションを考える何文字以上を超えたら「…」にする。とういのはよく見かけるかと思います。一番お手軽にやるとしたらCSSの「text-overflow: ellipsis;」と「white-space: nowrap;」を使うったやり方です。はみ出した文字を「…」にすることができますが、一行の場合にしか対応できません。今回のプラグインでは、厳密に何文字というよりも、指定した高さを超えた時に末尾を「…」に変換するように作ってみたいと思います。高さを条件とするので、複数行の場合でも対応することができます。オプション cutHei 制御する高さ afterText 末尾に追加する文字 data-textCut-link 要素にdata属性でリンク先を指定 blank リンクを別タブで開く true:false textCut.js /**文字カットプ
kyaido 2014/05/25
javascript

jquery
リンク
» 美しいスタイルガイドが作れるstyleDoccoを使ってみる | isee ウェブに関するブログ
スタイルガイドについてマークアップの仕様に関する決めごと：本の題名表記を斜体にする、数字や日付の表記法、文献引用の作法など。文体に関する決めごと：単語の綴り（スペリング）、句読法、時制、です体／である体など。スタイルガイドには空白や活字などタイポグラフィに関わるような要素に関して規定するものもある。ウェブサイトスタイルガイドの場合は、主に外観や技術的な側面に関するスタイルを規定する。 wikipedia参照スタイルガイドはcssを作った本人以外にも、IDやクラス、コンポーネントなどの役割を分かりやすく伝えることができ、サイトデザインの一貫性を促進することができます。また、業務を引き継ぐとなったときも、スタイルガイドがあればコーディングルールなども一目で分かるので、勘違いや相違もなくなります。スタイルガイドジェネレーターはstyleDocco以外にもいくつかありますが、styl
kyaido 2014/05/25
リンク
1