デバイスに合わせてCSSを振り分ける「Media Queries」 | DevelopersIO
Media Queriesは、読み込まれるCSSや、CSSの記述のインラインに条件を加えること出来るようになる仕様です。 今までもCSS2のMedia typesを使い、screenやprintなど大まかなメディア用スタイルを設定することはできました。ですが、それでけでは昨今のスマートフォン、タブレット端末事情にはとても対応できません。JavaScriptで対応する方法もありますがシンプルではありません。そこで、CSS3だけで振り分けが可能になるのがMedia Queriesという仕様です。 Media Queries Media Queriesはユーザーの端末、スクリーンサイズをもとに適したスタイルシートを適用することができます。Media Queriesを利用することで、PC用スタイルシート、タブレット用スタイルシート、スマートフォン用スタイルシートと個別にスタイルを指定することができ
【Webデザイナ－・コーダー向け】すぐに使えるSCSS入門｜基礎編 | DevelopersIO
はじめに 早速ですがみなさん、黒い画面（コンソールやターミナル）はお好きですか？ ちなみに僕は最近やっと黒い画面に対していくつかの呪文使えるくらいになりました。文系理系でもどちらでもなくさらに低学歴の僕にとっては潜れば潜るほど黒い画面がつきまといます。（今では好きですよ、黒い画面） 今回は、すぐに使えるSCSS入門｜基礎編ということで、「黒い画面など見たくない！」というあなたにも、GUI操作だけですぐに使えるアプリケーションのインストールからSCSSの基本的な利用方法について、実際の開発に使えるポイントを押さえて解説していきたいと思います。 SCSSを覚えて生産的で楽しいWebサイト制作・アプリケーション開発をしていきましょう。 まだSCSSを知らない方向けに「SCSS」って？ 前回の記事「Media Queriesの記述を少し楽にしてくれるSCSS（Sass） Mixin（自作）」からの
Sublime Text 2 のショートカット 12 選（Win、Mac両方） ｜ クラスメソッド開発ブログ
1ヶ月使って便利だと思った Sublime Text 2 のショートカット 12 選（Win、Mac両方） 今、巷で話題になっているエディタ Sublime Text 2 ですが、 最近社内のプロジェクトでも使用する機会が多くなってきました。 Sublime Text 2 http://www.sublimetext.com/ インターフェースがシンプルで高速、 機能を強化するパッケージも豊富で、Gitとの同期も快適です。 このブログでは、1ヶ月プロジェクトで使ってみて、 とても便利だと思ったショートカットを12個紹介します。 自分自身会社ではWindows、自宅ではMacなので、 Windows版とMac版の両方をメモ代わりとして記載することにします。 1. マルチセレクト このショートカットは複数の文字列をインタラクティブに選択し、一度にまとめて編集することができます。 OS X：⌘
Windows 7 Professional 64bitでのSQL Developerの設定 | DevelopersIO
Windows 7 ProfessionalでSQL Developerを使う場合の注意点をメモします。 Oracleのバージョンは11g R2でJDKは7を使っています。 SQL Developerをインストールして初めて起動する際、以下のようにjava.exeのパスを聞かれます。 ここに64bit版JDKのjava.exeを指定すると Unable to find a Java Virtual Machine. To point to a location of a Java Virtual Machine, please refer to the Oracle9i JDeveloper Install Guide (jdev\html) というアラートが表示され、起動できません。 その後、再度起動しようとしたら、今度はjava.exeのパスを指定するダイアログが表示されずに、 同じア
しがないOLのはじめての「Microsoft Access」 ～フォームのデザイン変更編～ | DevelopersIO
こんにちは。クニ吉です。 さて、前回はフォームの作成をしましたが、今回はそのフォームのデザインを変更してみましょう。 フォームの構成について プロパティシートについて プロパティの設定 フォームヘッダーの書式変更 コントロールの配置、サイズ変更 フォームの構成について フォームは「ヘッダー」、「詳細」、「フッター」の３つで構成されています。 入力するためのテキストボックスやコンボボックスなどの各種コントロールは「詳細」に配置されます。 「詳細」の情報量が多い場合は、詳細部分の右側にスクロールバーが表示され、詳細のみスクロールします。 ヘッダーやフッターは固定されるため、検索機能やボタンなどを配置するのに便利です。 画面を小さくして作業する場合、スクロールしないと入力やボタン操作ができないといったこともありますので、 よく考えて配置しましょう。 プロパティシートについて フォームをいじる時に
HTML5 × CSS3 × jQueryを真面目に勉強 – #17 Bootstrap をカスタマイズしてオリジナルテーマを作ってみた | DevelopersIO
トレンディ且つナウい Web ページを構築するための CSS フレームワーク（※枠組み）です。フレームワークというとなんだか大袈裟な響きですが、実態は単なる CSS と JavaScript という２つのテキストファイルだけで特別な使い方等もありません。利用者はこれらを HTML ファイルに読み込ませたのち、Bootstrap 側で既に定義済みのクラスを各 HTML 要素に指定するだけで、自分は一行も CSS を書くことなく高品質な Web ページが作れてしまったりします。 Twitter Bootstrap うろ覚えですが、2011年の夏頃に最初のメジャーバージョンがリリースされました *1。当時 Twitter のエンジニアで現在は Github にお勤め中の Mark Otto 氏によって開発され、2013年4月時点ではバージョン2.3.1が最新版となっています。またバージョン3.0
【便利ツール】Emmetで、ちょっと気持ちいいコーディング with sublime text 2・上巻 | DevelopersIO
【便利ツール】Emmetで、ちょっと気持ちいいコーディング with sublime text 2・上巻 こんにちは、ちょっと年末前くらいから、「Emmet」というキーワードを聞くようになり、 日頃お世話になっている、sublme text 2でも使えるということで今回、上下巻に分けてご紹介したいと思います。 アジェンダ Emmetとは？ 誰が開発してるの？ Emmetプラグインのインストール！ インストール後の設定 どんな感じがさわってみる。 おまけ Emmetとは？ はじめて「Emmet」を聞いた方は「Emmetってなに？」となるかと思いますので、簡単にご説明をできればと思います。 それでは、「Zen Coding」はどこかでお聞きしたことがあるのではないでしょうか？ 「Zen Coding」は、コード(スニペット)とショートカットを組み合わせて、効率的にHTMLやCSSのマークアップ
Sublime Text 2の基本とカスタマイズ【Vim風】
2012年12月4日：Vim化について指摘と参考になる情報をいただいたので追記しました。 こんにちは、僕はVimユーザーです（ちなみにVimを完璧に使いこなしているわけではありません）。 今更ながら「Sublime Text 2」というナウでヤングなエディタも使いこなせるようになりたいと思い、Sublime Textの基本設定からプラグインやスニペットの作り方まで調べた内容をこの記事にまとめることにしました。 細かい情報までまとめることはできなかったので、より詳しい内容を紹介してくださっているブログやサイトへのリンクを設けています。 この情報以外にもSublime Text 2をVimに近づけるプラグインやカスタマイズ方法があればコメントいただけるとうれしいです。 また、間違いがあればコメントいただければすぐに直します。よろしくお願いします！ Sublime Text 2は有料（$59）の
ADT Bundle で Android 開発環境を爆速で構築する (プラグインもあるよ)【7日目】 | DevelopersIO
はじめに ADT(Android Developer Tools) の最新版(r21)が公開され、同時に ADT Bundle という 全部入りの開発環境 が公開されました！いままで Eclipse 入れて ADT Plugin 入れて…って面倒でしたがこれでサクッと開発環境を構築できそうですね。 ということで今回は ADT Bundle を使って Android 開発環境を簡単に構築したいと思います。また、開発に便利なプラグインの導入方法もあわせてご紹介したいと思います。 ADT Bundle のインストール ADT Bundle をダウンロードする まず以下にアクセス。 http://developer.android.com/sdk/index.html 「Download the SDK」をクリックします。 規約が表示されます。環境にあわせ32bit版、64bit版のいずれかを選択
Android版PhoneGapプラグインの紹介 | DevelopersIO
こんにちわfukasawaです。今日もAndroidしてますか？ 今回はPhoneGapのAndroidプラグインについて現状(2011/10/25)どんなものが公開されているかを調べました。 プラグインはGitHubで公開されています。 https://github.com/phonegap/ ちなみに標準で用意されている機能はこちら（先にこちらで欲しい機能が用意されているか見たほうが良いです。） http://docs.phonegap.com/en/1.1.0/ - 公式 PhoneGap Android Plugin一覧 Analytics - Google Analytics for Mobile Appsを利用して、アプリ内でのイベント等のトラッキングデータを収集します。 BarcodeScanner - ZXing Barcode Scannerアプリを使用してバーコードの読
PhoneGapでカメラロールから写真選択 | DevelopersIO
はじめに さて、今回はPhoneGapでカメラロールから写真を取得してみようと思います。 始める前に、iPhoneシミュレーターに写真を追加します。追加したい写真をiPhoneシミュレーターにドラッグアンドドロップするとSafariが開いて写真が表示されるので、それを長押しして保存を選べばカメラロールに写真が追加されます。ちなみに写真の追加先は、/Library/Application Support/iPhone Simulator/{version}/Media/DCIM/100APPLEの様です。(LionからLibraryは隠しフォルダになっています。ファインダーから見るにはoptionを押しながらメニューのGOを開けば表示されます。) 実装する 画面 画面は、フッターにボタンを配置してそのボタンをタップするとカメラロールが表示され、その中から選んだ写真を画面に表示する様にします。
iOS6 Mobile SafariがAjax POSTでキャッシュする問題を回避する方法 | DevelopersIO
iOS6出た！ iOS6が出来ましたね。社内ではiPhone5を入手した社員がLTEの速度に驚いていました。私はまだiPhone4Sですが、iOS6にして新しい機能を楽しんでいるところです。さて、iOS6にしてSafariの仕様が変わって困ったと言った投稿が海外のフォーラムで挙っています。それも、基本的なPOST通信についてです。これは困ったということで、動作を確認して対策方法についてシェアしたいと思います。 どんな時にPOSTをキャッシュする？ まずはどんな状況か確認してみたいと思います。 Cache-ControlもExpiresも無い場合 ： iOS6 Mobile SafariはPOSTをキャッシュする Cache-Control max-age=0指定 と Expires指定 ： iOS6 Mobile SafariはPOSTをキャッシュする Cache-Control: no-
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
