はじめに このシリーズ「すぐに使えるSCSS入門シリーズ」ではScoutを使ってコンパイルしてきました。 最近Sublime Text 2のライセンスも買って、本格的に使い始めました。 そこで、今回はSublime Text 2(Windows, Mac)を使ってコンパイルする方法を調べたので、まとめて紹介したいと思います。 この記事ではデザイナーに苦手な人が多いかもしれない黒い画面「コマンドプロンプトとターミナル」を利用します。 難しいんじゃないかと思うかもしれませんが、是非挑戦してみてください。そのうち大したことしてないじゃんと思えるようになります。 主な流れ 主な流れはこんな感じで、最初に黒い画面でコマンドを入力していきます。 それが終わればSublime Text 2の設定を行い、コンパイルを試します。 Rybyのインストール インストールの確認とコンソール Sassのインストール
2012年 11月 21日 使ってわずか10分でメインエディタを変えてしまったSublime Text (ST2)がめちゃめちゃ使いやすい件 カテゴリ: PCツール タグ:エディタ 最近流行ってるsublime textというエディタですが僕も試しに使って10分ぐらいでメインエディタにしてしまいました。なんせ使いやすいです。 個人的にショートカットで作業効率がガンガン上がっていくのが非常に嬉しいですね。ちょっとそのあたりを紹介したいなと思います。 1.sublime textとは 2.作業効率を上げる便利なショートカットキー 3.マウス操作との連携で入力を支援 4.カスタマイズで更に便利に!プラグインに関して 5.その他便利な機能 6.参考文献 7.追記 sublime textとは windows,mac,linuxで動作するエディタです。テキストの編集やコーディングを早くするショートカ
この記事は Sublime Text 2 Advent Calendar 2012 とは関係なく書いております。 いや、Sublime Text 2 Advent Calendar 2012 で投稿されていた 一石三鳥!?SublimeText2とsass/SCSS(compass)+SFTPで作業効率化する方法。 という記事を読んで、自分で試したことのメモなので少し関係あるかな。 記事書いてくれた @tomo_thumb さん、ありがとうございます m(_ _ )m ということで、Sublime Text 2 だけで Sass/Compass のコンパイルができるということで、黒い画面でコマンドゴニョゴニョしたり、いちいち Scout 立ち上げたりしなくてもよさそうなので、Sass/Compass の導入の敷居が少し下がりそうな感じですね。以下、Windows 環境での解説。 pack
こんにちは。デザイナーのハルエです。 Dreamweaverの数ある機能を十分に活用できてる方ってどのくらいいるのでしょうか? 私の場合、これまで最低限の機能しか使ってこず、操作上でわずらわしく感じることでも我慢してたんです。で、そのわずらわしさも苦痛に感じなくなってきて、いつの間にか慣れちゃってました。いけない子ですね。 そこで今日は以前の私みたいな方のために、作業効率を良くするDreamweaverの便利な拡張機能やおすすめ設定術を紹介させていただきます。 閉じタグコメントを自動挿入:End_comment.mxp 閉じタグコメントはソースの構造をチェックしたりする時に便利なんですが、その都度書いていくのって手間ですよね。 この拡張機能は閉じタグコメントを自動で挿入してくれます。もちろんIDとclassもちゃんと認識してくれます。 コメントを生成して挿入するDreamweaver用の拡
27 Nov 2012 Zen CodingもといEmmetを使いこなすとまでいかなくとも、それなりに使ってはいるが、実はCSSではあんまり活用していなかった。 というもCSSに関しては、多少Emmetや他のコード補完プラグイン(パッケージ)の支援はあるものの、HTMLよりも手グセというか、自然とプロパティなり値なりをさっさと書いてしまうし、それほどありがたい、と思えるほどでもない。 またZen Codingにせよ、Emmetにせよ、短縮形のルールが決まっているし、それらを覚えないといけないので少し大変だ。 そこでHayaku、らしい 二度見しそうな名前だが、これはHayakuというSublime Text2のパッケージ。Emmetと違い、対象になるのはCSS(とCSSプリプロセッサ)であり、前述の通りCSSの記述に関してはこれといったツールを使っていない自分でも感動した。 ちなみにHay
All the Cool Kids Compile Sass, Less, Stylus, CSS, CoffeeScript, Pug, Slim, Haml, TypeScript, JavaScript, ES6, Markdown, JSON, SVG, PNG, GIF and JPEG right out of the box. Dead-Simple Configuration Want compressed CSS? Just check a box. Need to transpile JavaScript? Check a box. Every tool's options are available in a beautiful, clean UI. No more hacking build scripts. Bleeding-Edge Tools Autopref
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
photoshopessentials.comのエントリーから、Photoshopでレイヤーを操作する便利なショートカットを紹介します。 Adobe Photoshop Tutorials: Layers Power Shortcuts ショートカットは、コマンド別にしています。 ※Win XP+Photoshop CS2でのコマンドです。 Macの場合は、下記置き換えてください。 Ctrl = Cmd Alt = Opt 右クリック = Control + クリック F7 レイヤーパレットの表示・非表示の切り替え。 [Shift] + [Ctrl] + [N] レイヤーを新規作成。 [Shift] + [Ctrl] + [Alt] + [N] レイヤーを新規作成(ダイアログボックス無し)。 [Ctrl] + 「新規レイヤーを作成」ボタン 選択したレイヤーの下にレイヤーを新規作成。 ※背景
Get a new domain registered at NameSilo.com. Find out who owns any domain name with the WHOIS tool. This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
2011年11月27日 情強がひた隠しにしているフリーソフトまとめ Tweet 3コメント |2011年11月27日 13:30|ソフト・アプリ等|Editタグ :フリーソフト >http://uni.2ch.net/test/read.cgi/news/1322219255/ ニュース速報「情強ν速民がお勧めするフリーソフト」http://hatsukari.2ch.net/test/read.cgi/news/1310540136/51 :(チベット自治区):2011/07/13(水) 16:08:10.22 ID:Wp6ZvTmw0 GDI++(フォント表示がめっちゃきれいになる) http://www18.atwiki.jp/gdiplus2/ bluewind(シンプルで早いテキストランチャ) http://www.web-ghost.net/bluewind/ マウ筋(マウスジ
MACANTOGEL: Situs Togel Uang Asli Indonesia yang Terpercaya MACANTOGEL adalah salah satu situs togel uang asli Indonesia yang paling terpercaya dan populer di kalangan pecinta togel. Dengan pelayanan terbaik dan fasilitas lengkap, MACANTOGEL telah menjadi pilihan utama bagi banyak penggemar togel di Indonesia. Keunggulan MACANTOGEL MACANTOGEL menawarkan berbagai keunggulan yang membuatnya menonjol
どんな感じで書けば楽できるかとか、後から修正しやすいかとか、そんなことです。 ボタンのスタイリングを例に、自分の通った道を追ってみます。 今回使う HTML は次のようになっています。 <div class="buttons"> <button class="edit">Edit</button><button class="publish">Publish</button><button class="delete">Delete</button> </div> これを CSS でスタイリングしていきます。 1. とりあえず個別指定 こんな極端な書き方する人はあまりいないでしょうけど、例として。 .edit { margin: 0 5px; padding: 0; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 5px; widt
アドビフォトショップショートカットリスト AdobePhotoshopShortcutList byBSCverCS6.26(ビスク式w (ショートカットリストは書き出せるのに何故かスタンプとかないんで作って見ました・・・現在CS6のショートカットも追加中 このページはフォトショップのショートカットを自分なりに纏めて覚えるときために作ったフォトショップの使い方・ショートカット集のページです。 一緒にショートカットの類似系を覚えると便利なのでわざと説明を重複させてます、たった数段下でも重複させていますw。 見やすい・見難い・ショートカットが足りない・こうしたら見やすくなるかも・等ありましたらツイッターでリプライでもください。 できるだけ修正いたします。 見やすいようにタグを調整しました。 MACの場合はCtrlをCommandに読み替えてください。 押したキーから何のショートカットかわかるコ
[Å] 「MarsEdit」デビュー!ブログを爆速に書ける予感!?導入から投稿までメモ
先日このブログをリニューアルさせて頂いた旨をご報告させて頂きましたが、今回のリニューアルの主目的だったレスポンシブデザイン化について、とにかく効率優先で作業させて頂いた時のリソース関連や情報を一度僕自身の忘備録として抜粋してまとめさせて頂こうと思います!以前別のブログを作った時もそうですが、基本僕はとにかく効率重視派です。細部に渡る美しいデザインや、ガリガリのプログラミング。標準に法ったコーディングとかはその道のスペシャリストが仲間内に居るので、今回も僕は効率化に焦点を当てています! ご紹介させて頂くのは主にFacebookやTwitter周りで共有させて頂いてきたリソースばかりですが、実際に使ってみると見えてくる注意点や、戸惑った部分、周りのデザイナーにも知っておいて欲しい部分等が見え隠れしてきたので、まずはその辺りを中心に、作業ステップ毎に簡単にご説明させて頂こうと思います。 僕と同じ
株式会社8bitのスタッフブログです。こんにちは。株式会社8bitの高本です。 最近、個人で作っているWebサービスを作っている人の作業速度が異常に速いので、どうしてそんなに速くできちゃうのか考えていました。 ちょっと昔の話ですが、「予告.in」というサービスは2時間で公開したそうです。 犯行予告収集サイト「予告.in」公開 「0億円、2時間で作った」 震災の際もかなりのスピード(数時間~数日)で安否情報や震災に関する情報を配信するサービスが立ち上がっていました。 企業でやっているものもありますが、そのほとんどは個人といっても良い人数で作られています。 Anpi (いつから作り始めたのかわかりませんが、15日には公開していました。) SAVE Japan (6時間で公開したそうです。) 企業で収益性を見越したWebサービスを作る際は、もちろん色々と考えないといけませんが、
みなさんこんにちは!ショートカットキー大好き!するぷ( @isloop )です。 最近、スーパープログラマー@akio0911さんと一緒に作業させてもらってるんですが、ふと@akio0911さんのキーボード捌きを見るとなんか独特なので、「一体これはなにをしてるんですか!?」と聞いてみたところ、「Controlキーのショートカットキーを駆使して文字入力してるんです。これ覚えると便利ですよー」と。 試しにやってみたらこれは感動! むちゃくちゃサクサク文字入力がすすむじゃないっすか! というわけで、今回は@akio0911さんオススメのMacの作業効率を恐ろしくあげるControlキーを使った7つのショートカットキーをご紹介したいと思います! カーソルを上げ下げするControl ショートカットキー。 カーソル移動はカーソルキーを使うのが常識ですが、実は以下のショートカットキーを使っても移動でき
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く