taka222のブックマーク - はてなブックマーク

taka222 id:taka222

ブックマーク / kojika17.com (3)

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></
taka222 2013/09/10
”IDを使わないCSSの設計｜Web Design KOJIKA17”
リンク
イラレのアピアランスで作れたアイコンが凄かったので、HTMLとCSSで模写した。 - kojika17
数カ月前に@suzukisan__が投稿された「Illustrator Unlimited Appearance - suzuki | JAYPEG」は、Illustratorのアピアランスを駆使して、1つのオブジェクトからカメラのアイコンを作るという、面白い試みをされていました。アピアランスの可能性を示す、インパクトのある内容であったため、記憶に残っている方もいることでしょう。このアイコンが投稿されてから時間がたっていますが、HTMLとCSSに分解されるイメージが自然に湧いてきたので、少しばかりのHTMLとCSSでアイコンを模写してみました。 HTML と CSS で作ったカメラアイコン模写したカメラアイコンは、Internet Explorer 10以上や、最新のChrome, Firefoxなどであれば表示されるはずです。こちらがHTMLとCSSで書いたものになります。ソ
taka222 2013/08/07
"イラレのアピアランスで作れたアイコンが凄かったので、HTMLとCSSで模写した。｜Web Design KOJIKA17"
リンク
IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。
IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。 2011-05-02 Webサイトをコーディングする時に、IDとclassを考えるのが面倒臭くなったので、IDとclassを使わないでコーディングしてみました。シンプルなサイトなら簡単でつまらないので、IDとclassを使っても難しそうなデザインにしています。今回もJavaScriptは一切、使用していません。完成したサイト ID, classなしで組んだサイトを見る。サイトでやってみたHTML5 HTML5では、html, head, bodyタグを完全に省略しても構わないとされています。省略してもDOMツリー上に存在しているので、 body {background:#f00;} というCSSの記述も認識してくれました。サイトで使用したCSS, CSS3の簡単なまとめ Child Selector 結
taka222 2011/05/02
リンク
1