[B! css] managonのブックマーク

IDを使わないCSSの設計 - kojika17

CSSのスタイリングではIDを使用しない、という話をよく聞くようになりました。私も最近は、IDを使わずにコーディングしているので所感を書きます。 CSSでIDを使わない﹁IDを使わない﹂ということをHTMLの変化で示すと、以下のようになります。 <div id="header" class="clearfix"> <h1 id="logo"><a href="">logo</a></h1> <ul id="heaeder-info"> <li class="about"><a href="">about</a></li> <li class="sit emap"><a href="">sit emap</a></li> </ul> </div> ↓↓↓↓ <div class="header clearfix"> <h1 class="logo"><a href="">logo</a></

managon 2013/09/10

css
html

リンク

CSSセレクタ20個のおさらい

CSSセレクタって意外と分かっていなかったりするので勉強ついでにまとめてみました。比較的実用的かなと思うものを20個紹介していきます。いい復習になればと思います。 CSSセレクタはスタイルを適用する対象を指定するものです。普段何気なく使っているclassやidなどもセレクタの1つです。属性や要素といった堅苦しい用語が出てきますので図で簡単に説明します。私のように基礎から勉強していないと、要素や属性と聞いてもピンときませんが、知ってみるとなんてことはないですね。また、IEが対応しきれていないCSS3のセレクタもありますが、IE6～8でもCSS3セレクタが利用できるツールの決定版﹁Selectivizr﹂で紹介したようにCSS3セレクタはie対策も容易なのでぜひお試しください。 SelectivizrはCSSを外部ファイルで指定した方がいいのですが、今回のサンプルはCSSを外部ファイル

managon 2011/06/16

css

リンク

http://e0166nt.com/blog-entry-862.html

managon 2011/03/11

css

リンク

「CocProxy」という便利なツールを知っていますか？ : LINE Corporation ディレクターブログ

こんにちは。ブログビジネス部石野です。 livedoor Blogやクリップ、Readerの担当ディレクターです。今日は﹁CocProxy﹂というツールをご紹介します。同僚のプログラマーに教わったのですが、便利です。コーディングにも携わるディレクターにはぜひ知っておいてほしいツールです。 CocProxyとはブラウザからのリクエスト先をローカルファイルに置き換えてくれるプロキシです。︵一見取っつきにくそうですが︶デバッグ時にその環境を用意をするまでの手間をなくしてくれる、時間短縮してくれるツールです。メリット Ajaxを使っているなど、デバッグ環境を用意するのが大変な場合もプロキシの切り替え1つで済みます。また、確認するために編集したファイルをサーバへアップロードして…といった手順をスルーできます。amachangさんのこの記事を見て﹁名前は知っていたけど﹂という方も、

managon 2010/01/19

あとでやってみる

リンク

101 CSS Techniques Of All Time- Part 1 - noupe

CSS has fundamentally changed web design, it has provided designers with a set of properties that can be tweaked to make various techniques to make your pages just look right. Today we are presenting a round-up of 101 CSS techniques designers use all the time. Definitely worth taking a very close look at! This is just the first series , the second part will be coming soon, stay tuned and Enjoy! CS

managon 2008/01/18

リンク

WEBデザインセンス向上まとめ。カラー統一サイト30×5・計150サイト＋2200以上の無料HTMLテンプレ*ホームページを作る人のネタ帳

managon 2007/04/22

リンク

新規でサイトを作る際に僕がいつも使ってるCSSのセットを公開するよ::::::STOPN' LISTEN::::::to the silence:::::::

esprit

managon 2007/02/14

css

リンク

Layout Gala: a collection of 40 CSS layouts based on the same markup and ready for download!

by Alessandro Fulciniti In November 2005 I presented on pro.html.it a three-part article on creating CSS layouts using techniques like negative margins, any order columns and in some case opposite floats. The main goal of the article was getting the maximum number of layouts based on the same markup, each with valid CSS and HTML, without hacks nor workaround and a good cross-browser compatibility.

managon 2007/01/27

リンク

便利すぎて困る程のFireBug1.0系を使ってみよう:phpspot開発日誌

Firebug - Web Development Evolved 便利すぎて困る程のFireBug1.0系を使ってみよう、ということで、広く使われているであろう0.4系と変わった点をプレビュー。 Googleなどの検索エンジンで、addons.mozilla.org にUPされている0.4系が上に表示されているため、まだ1.0系を使っていない人も多いのではないでしょうか？(という私もそうでした) FireBug1.0系のインストール方法の紹介〜その追加された強力すぎる機能について見ていきましょう。 FireBug1.0系インストール http://www.getfirebug.com/ にてFireBug1.0系のインストール。 FireFox - DOMインスペクタのインストール FireFoxインストール時にDOMインスペクタが入っていない場合は、FireBug1.0系の機能を最大限

managon 2006/12/20

リンク

GIGAZINE - CSSで角をもっと丸くする方法いろいろ

﹁スライディングドア﹂と呼ぶ方法で全体をヘッダー、ボディ、フッターの3つに分割して、コーナー部分などはオーバーレイとか使ってみましょう、という方法。 Another attempt at CSS rounded-corner dialogs using the sliding doors technique http://www.schillmania.com/projects/dialog/ 使用しているコードと画像のダウンロードはこちらから http://www.schillmania.com/projects/dialog/dialog.zip また、こちらに透過PNGを利用したバージョンもあります。 Another attempt at CSS rounded-corner dialogs using the sliding doors technique http://www.s