[B! less] yuichiro0526のブックマーク

Online StyleSheet Generator | OneClickCSS

What's this? HTMLソースをもとに、id,class名CSS、子孫セレクタCSS、子セレクタCSS、LESS、SASS、SCSSを自動生成するオンラインサービスです。従来のHTMLコーディグを強力にサポートします。 What's LESS/SASS/SCSS? LESS / SASS / SCSSはCSSを効率的にコーディングできるCSSメタ言語です。従来のCSSに比べ子孫セレクタ・子セレクタを簡単に管理することができ、高速にコーディングすることができます。 LESS OFFICIAL SASS/SCSS OFFICIAL 関連サービス高画質サムネイル生成サービス HTTPクエリデコード SQLフォーマッター Insert文フォーマッタースペースフォーマッター JSONフォーマッター HTML/XMLフォーマッター Emmet toolkit for <textare

yuichiro0526 2013/03/08

リンク

HTML5 × CSS3 × jQueryを真面目に勉強してみる – #4 LESS | DevelopersIO

そんな訳で、拡張メタ言語の中でも特にハードルの低いだろうLESSに触れてみることにしました。拡張メタ言語 - LESS メタと称されるだけあって、LESSはHTMLやCSS、JavaScriptといった類の言語とは毛色が違います。そういった言語によって記述されたソースコードと同じ意味（機能）を持ちながら、より簡略的に表現できるようにしたための言語というわけです。念のため分かりやすく補足しておきますと、メタとは比喩とか暗喩という意味であって、「アンタなんか牡丹じゃなくて豚よッ！」というセリフの豚という表現が正にメタに当たります。 ※豚というのは例えであって、本当に動物の豚だといっているわけではありません。他にもこのような拡張メタ言語には、CSSに対してSCSS(Sass)、HTMLに対してHamlといったものがあります。JavaScriptに対してCoffeeScriptというのが比較

yuichiro0526 2012/10/04

リンク

CSSの記述が3倍速くなる「LESS」の使い方 (1/2)

2012年02月09日　13時58分更新文●斉藤祐也／<a href="http://css.studiomohawk.com/">CSS Radar</a> 最近のWebサイトは大規模傾向にあり、Webアプリケーションを構築する機会も増えてきました。jQueryやMooToolsなど、JavaScriptを手軽に利用できるようにするライブラリーが普及する一方、Webサイトの表示を担うCSSにも、「Blueprint」や「960 Grid System」に代表されるフレームワークが登場しています。「LESS」や「Sass」のようなCSS拡張メタ言語は、こうしたフレームワークとは異なり、CSSの言語自体を拡張し、CSSには存在しない機能を追加するものです。CSS拡張メタ言語を利用することで、変数、ミックスイン、入れ子ルール、名前空間、四則演算、関数などの動的な処理をCSSに追加でき、CS

yuichiro0526 2012/02/29

リンク

lessでソースコードに色をつける

シェルの操作中「テキストファイルをちょこっと覗きたいな」と思ったときに抜群に便利なlessコマンドであるが、普段綺麗に色付けされたソースコードを見慣れていると、モノクロのソースコードの見づらさに愕然としてしまう。結局lessを終了して他のエディタで開きなおすことになるのだが、lessでソースコードに色付け（シンタックスハイライト）できれば便利なのになーっ！と思ったことはないだろうか。そう、あるんです！lessでシンタックスハイライトする方法はあるんです！というわけで、今日はその方法を紹介しよう。 GNU Source-highlight結論から言うと、今日紹介する方法はGNU Source-highlightを使う。GNU Source-highlightを使えばイッパツだ。なのでまずGNU Source-highlightをインストールしよう。UbuntuやFedoraならリポジトリにあ

yuichiro0526 2011/11/10

リンク

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