【CSS】CSS Digをつかって、開発者ツールとはちょっと違ったCSS解析 | unitopi - ユニトピ -
CSS Digとは、Webページの解析用拡張機能で、使用されているプロパティ一覧や使われ方などをひと目で確認できるものです。 Chromeの拡張機能として使えます。 インストール こちらから→ CSS Dig 中央にある「ADD TO CHROME」をクリックし、ChromeのWeb storeにいきます。 「＋ ADD TO CHROME」をクリックして、拡張機能をインストールしましょう。 ツールバーに↑このように表示されるはずです（ｄって書かれているやつです） さっそく使ってみる universionsのページでやってみました。 ツールバーの「ｄ」をクリックすると、上記のようなスタイルシートの一覧がでてきます。styleblockと書かれているのは、インラインで書かれたStyleです。 「START DIGGING」で進みましょう。（ちなみにDIGGINGは採掘・掘ることです。なんかそ
【Tools】Chromeデベロッパーツールを使いこなすための５つのTips | unitopi - ユニトピ -
つい数記事前にCSS DigというCSSデバッグツールをご紹介したのですが、やはりChromeのデベロッパーツールは充実していますね。本日は基本的な使い方ではなく、もっと便利に使うためのTipsをご紹介します。 （CSS Digに関するページはこちら） ※ キーはMacとなっています。Windowsユーザーの方CommandをCtrlに読み替えてください。 1. Command＋Pで開きたいファイルをサーチブラウジング 2. Command + Opt + Fでソースコード内検索 3. Ctrl + G で行番号指定したところまでいく 4. Sublime Textみたいに複数行にカーソルを置いて編集 commandを押しながらカーソルを複数箇所におけます！ （ちなみにcommand+Dで同じ文字列を選択していくこともできる！） 5. minifyされても整形できる このようなJSでも。
【JavaScript】（基礎）親要素・子要素の取得・追加まとめ③ | unitopi - ユニトピ -
こんにちは！ unitopi新米ライターの、ケインでございます。 このシリーズも最終回。今回も、JavaScriptにおいて基本的だけど忘れがちな、JavaScript（jQuery）における「親要素・子要素の取得・追加（削除）」について、今回は「要素の追加と削除」のお話をさせていただきます！ ちなみに今回は、説明の仕方がこれまでの２回と異なるアプローチになっているので、その点ご承知おきください！（※なぜなら紹介する量が多そうだからです…） ※サンプルコードは、「JS」タブや「HTML」タブなどを交互に見ていってくださいね！ ※このシリーズのこれまでの記事は「その①」及びその②になります。まだご覧になっていない方で、合わせて勉強したい方はぜひご覧くださいね！ 【JavaScriptの場合】 jQueryに比べると少ないですが、それなりに表現方法の数がありますので、どんなものがあるか、一覧を
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
