https://b.hatena.ne.jp/TaRO/CSS/ CSSに関するTaROのはてなブックマーク (90) http://gcss.info/ かわいい TaRO 2013-07-05T06:32:17Z css <blockquote cite="http://gcss.info/" title="http://gcss.info/"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fgcss.info%2F" alt="" /> <a href="http://gcss.info/">http://gcss.info/</a></cite><p><a href="http://gcss.info/"><img src="" alt="http://gcss.info/" title="http://gcss.info/" class="entry-image" /></a></p><p></p><p><a href="https://b.hatena.ne.jp/entry/gcss.info/"><img src="https://b.hatena.ne.jp/entry/image/http://gcss.info/" alt="はてなブックマーク - http://gcss.info/" title="はてなブックマーク - http://gcss.info/" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/gcss.info/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 219 https://mixiengineer.hatenablog.com/entry/2012/10791/ TaRO 2012-02-22T16:51:20Z css sass <blockquote cite="https://mixiengineer.hatenablog.com/entry/2012/10791/" title="なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fmixiengineer.hatenablog.com%2Fentry%2F2012%2F10791%2F" alt="" /> <a href="https://mixiengineer.hatenablog.com/entry/2012/10791/">なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog</a></cite><p><a href="https://mixiengineer.hatenablog.com/entry/2012/10791/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/3b38b0e79ddda9633fec1ac4f2e11b1b96dac4fd/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fogimage.blog.st-hatena.com%2F12921228815729510653%2F12921228815730296634%2F1408080898" alt="なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog" title="なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog" class="entry-image" /></a></p><p>こんにちは。最近、実は JavaScript よりも Perl が好きなたんぽぽグループの大形です。 Perl の、仕様書など無いところがたまりません。勉強しても勉強しても...。いえ、今回は Perl の話ではありませんでした。 一昨日の土曜日ですが、会社にお金を出して貰って、 SwapSkills さんの『CSSを便利に使うための　LESS入門...</p><p><a href="https://b.hatena.ne.jp/entry/s/mixiengineer.hatenablog.com/entry/2012/10791/"><img src="https://b.hatena.ne.jp/entry/image/https://mixiengineer.hatenablog.com/entry/2012/10791/" alt="はてなブックマーク - なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog" title="はてなブックマーク - なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/mixiengineer.hatenablog.com/entry/2012/10791/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 108 https://terkel.jp/archives/2011/12/css-reset-2011-winter/ TaRO 2012-02-10T08:50:19Z css <blockquote cite="https://terkel.jp/archives/2011/12/css-reset-2011-winter/" title="俺の CSS リセット: 2011 冬"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fterkel.jp%2Farchives%2F2011%2F12%2Fcss-reset-2011-winter%2F" alt="" /> <a href="https://terkel.jp/archives/2011/12/css-reset-2011-winter/">俺の CSS リセット: 2011 冬</a></cite><p><a href="https://terkel.jp/archives/2011/12/css-reset-2011-winter/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/8b717decc0f8733b98ae731c76a33fd70855be45/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fterkel.jp%2Fapple-touch-icon.png" alt="俺の CSS リセット: 2011 冬" title="俺の CSS リセット: 2011 冬" class="entry-image" /></a></p><p>年末だからというわけでもないのですが、いつものサイト作りに使う CSS リセットについて見直してみました。今までもちょっとずつ手を入れてはいたのですが、今回はかなり大きく修正しています。というのも、Nicolas Gallagher と Jonathan Neal の両氏による normalize.css を知り、大きく影響を受けたからです。 Norma...</p><p><a href="https://b.hatena.ne.jp/entry/s/terkel.jp/archives/2011/12/css-reset-2011-winter/"><img src="https://b.hatena.ne.jp/entry/image/https://terkel.jp/archives/2011/12/css-reset-2011-winter/" alt="はてなブックマーク - 俺の CSS リセット: 2011 冬" title="はてなブックマーク - 俺の CSS リセット: 2011 冬" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/terkel.jp/archives/2011/12/css-reset-2011-winter/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 651 https://coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html TaRO 2012-02-10T08:42:22Z css ie <blockquote cite="https://coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html" title="納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fcss%2Fcross-browser-css-workflow-by-impressivewebs.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html">納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html"><img src="" alt="納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー" title="納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー" class="entry-image" /></a></p><p>まだまだIE7、そしてIE6のユーザーをターゲットに考えているウェブサイトは多くあると思います。 そんなIEユーザーをターゲットに含めたウェブサイトを制作する上で、より効率的にCSSの開発が行えるワークフローを紹介します。 Cross-Browser CSS Development Workflow [ad#ad-2] 下記は各ポイントを意訳したものです。 ...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html" alt="はてなブックマーク - 納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー" title="はてなブックマーク - 納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/css/cross-browser-css-workflow-by-impressivewebs.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 612 https://ascii.jp/elem/000/000/668/668205/ TaRO 2012-02-10T08:03:35Z css less <blockquote cite="https://ascii.jp/elem/000/000/668/668205/" title="CSSの記述が3倍速くなる「LESS」の使い方 (1/2)"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fascii.jp%2Felem%2F000%2F000%2F668%2F668205%2F" alt="" /> <a href="https://ascii.jp/elem/000/000/668/668205/">CSSの記述が3倍速くなる「LESS」の使い方 (1/2)</a></cite><p><a href="https://ascii.jp/elem/000/000/668/668205/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/30f31700b422af5ad24f98ff485c7fc930593897/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fascii.jp%2Fimg%2F2012%2F12%2F28%2F347614%2Fl%2F89c627a93287410d.jpg" alt="CSSの記述が3倍速くなる「LESS」の使い方 (1/2)" title="CSSの記述が3倍速くなる「LESS」の使い方 (1/2)" class="entry-image" /></a></p><p>2012年02月09日　13時58分更新 文●斉藤祐也／&lt;a href=&quot;http://css.studiomohawk.com/&quot;&gt;CSS Radar&lt;/a&gt; 最近のWebサイトは大規模傾向にあり、Webアプリケーションを構築する機会も増えてきました。jQueryやMooToolsなど、JavaScriptを手軽に利用できるようにするライブラリーが普及する一方、Webサイトの表示を担うCSSにも...</p><p><a href="https://b.hatena.ne.jp/entry/s/ascii.jp/elem/000/000/668/668205/"><img src="https://b.hatena.ne.jp/entry/image/https://ascii.jp/elem/000/000/668/668205/" alt="はてなブックマーク - CSSの記述が3倍速くなる「LESS」の使い方 (1/2)" title="はてなブックマーク - CSSの記述が3倍速くなる「LESS」の使い方 (1/2)" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ascii.jp/elem/000/000/668/668205/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 751 https://ecsspert.com/css3-logos/twitter/ TaRO 2011-10-28T05:45:35Z css <blockquote cite="https://ecsspert.com/css3-logos/twitter/" title="Twitter logo in CSS3 | eCSSpert.com"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fecsspert.com%2Fcss3-logos%2Ftwitter%2F" alt="" /> <a href="https://ecsspert.com/css3-logos/twitter/">Twitter logo in CSS3 | eCSSpert.com</a></cite><p><a href="https://ecsspert.com/css3-logos/twitter/"><img src="" alt="Twitter logo in CSS3 | eCSSpert.com" title="Twitter logo in CSS3 | eCSSpert.com" class="entry-image" /></a></p><p>Logo recreated using pure HTML and CSS3. No images. No JS. &lt;div id=&quot;twitter&quot; class=&quot;icon&quot;&gt; &lt;div class=&quot;twitter1 draw&quot;&gt;&lt;/div&gt; &lt;div class=&quot;twitter2 mask&quot;&gt;&lt;/div&gt; &lt;div class=&quot;twitter3 draw&quot;&gt;&lt;/div&gt; &lt;div class=&quot;twitter4 mask&quot;&gt;&lt;/div&gt; &lt;div class=&quot;twitter5 draw&quot;&gt;&lt;/div&gt; &lt;div class=&quot;twitter6 draw&quot;&gt;&lt;/div&gt; &lt;d...</p><p><a href="https://b.hatena.ne.jp/entry/s/ecsspert.com/css3-logos/twitter/"><img src="https://b.hatena.ne.jp/entry/image/https://ecsspert.com/css3-logos/twitter/" alt="はてなブックマーク - Twitter logo in CSS3 | eCSSpert.com" title="はてなブックマーク - Twitter logo in CSS3 | eCSSpert.com" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ecsspert.com/css3-logos/twitter/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 32 https://hail2u.net/blog/webdesign/ore-ore-scss-writing-rule TaRO 2011-10-25T18:48:23Z css <blockquote cite="https://hail2u.net/blog/webdesign/ore-ore-scss-writing-rule" title="(S)CSSの書き方メモ"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fhail2u.net%2Fblog%2Fwebdesign%2Fore-ore-scss-writing-rule" alt="" /> <a href="https://hail2u.net/blog/webdesign/ore-ore-scss-writing-rule">(S)CSSの書き方メモ</a></cite><p><a href="https://hail2u.net/blog/webdesign/ore-ore-scss-writing-rule"><img src="" alt="(S)CSSの書き方メモ" title="(S)CSSの書き方メモ" class="entry-image" /></a></p><p>HTML5時代に向いていそうな(S)CSSの書き方を模索しています。SCSSで書くのでモジュール式に色々分割した方が良さそうだな……とか色々試してますが、なかなかこれ！　というものに辿りつけません……。ということで、ここ最近の書き方をメモがてら晒してみる試みです。 実際にこのサイトで使っているSCSSファイルを抜粋しつ...</p><p><a href="https://b.hatena.ne.jp/entry/s/hail2u.net/blog/webdesign/ore-ore-scss-writing-rule"><img src="https://b.hatena.ne.jp/entry/image/https://hail2u.net/blog/webdesign/ore-ore-scss-writing-rule" alt="はてなブックマーク - (S)CSSの書き方メモ" title="はてなブックマーク - (S)CSSの書き方メモ" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/hail2u.net/blog/webdesign/ore-ore-scss-writing-rule"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 134 http://html5doctor.com/html-5-reset-stylesheet/ TaRO 2011-10-23T13:54:29Z html5 css <blockquote cite="http://html5doctor.com/html-5-reset-stylesheet/" title="HTML 5 Reset Stylesheet | HTML5 Doctor"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fhtml5doctor.com%2Fhtml-5-reset-stylesheet%2F" alt="" /> <a href="http://html5doctor.com/html-5-reset-stylesheet/">HTML 5 Reset Stylesheet | HTML5 Doctor</a></cite><p><a href="http://html5doctor.com/html-5-reset-stylesheet/"><img src="" alt="HTML 5 Reset Stylesheet | HTML5 Doctor" title="HTML 5 Reset Stylesheet | HTML5 Doctor" class="entry-image" /></a></p><p>We’ve had a number of people ask about templates, boilerplates, and styling for HTML 5. Last week, Remy introduced some basic boilerplates for HTML 5, so to keep the momentum going, I’ve modified Eric Meyer’s CSS reset for you to use in your HTML 5 projects. The code Let’s start with the complete...</p><p><a href="https://b.hatena.ne.jp/entry/html5doctor.com/html-5-reset-stylesheet/"><img src="https://b.hatena.ne.jp/entry/image/http://html5doctor.com/html-5-reset-stylesheet/" alt="はてなブックマーク - HTML 5 Reset Stylesheet | HTML5 Doctor" title="はてなブックマーク - HTML 5 Reset Stylesheet | HTML5 Doctor" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/html5doctor.com/html-5-reset-stylesheet/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 182 https://developer.yahoo.com/yui/ TaRO 2011-10-23T13:52:21Z css <blockquote cite="https://developer.yahoo.com/yui/" title="Yahoo! UI Library"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fdeveloper.yahoo.com%2Fyui%2F" alt="" /> <a href="https://developer.yahoo.com/yui/">Yahoo! UI Library</a></cite><p><a href="https://developer.yahoo.com/yui/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/68048a6603a7f3ae549f86e9278749546fd1b378/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fs.yimg.com%2Foo%2Fcms%2Fproducts%2Fsite%2Fassets%2Fydn200.png" alt="Yahoo! UI Library" title="Yahoo! UI Library" class="entry-image" /></a></p><p>Measure, monetize, advertise and improve your apps with Yahoo tools. Join the 200,000 developers using Yahoo tools to build their app businesses.</p><p><a href="https://b.hatena.ne.jp/entry/s/developer.yahoo.com/yui/"><img src="https://b.hatena.ne.jp/entry/image/https://developer.yahoo.com/yui/" alt="はてなブックマーク - Yahoo! UI Library" title="はてなブックマーク - Yahoo! UI Library" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/developer.yahoo.com/yui/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 599 http://zero.css-happylife.com/ TaRO 2011-10-20T19:02:09Z css <blockquote cite="http://zero.css-happylife.com/" title="CSS HappyLife ZERO"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fzero.css-happylife.com%2F" alt="" /> <a href="http://zero.css-happylife.com/">CSS HappyLife ZERO</a></cite><p><a href="http://zero.css-happylife.com/"><img src="" alt="CSS HappyLife ZERO" title="CSS HappyLife ZERO" class="entry-image" /></a></p><p>CSS HappyLife ZEROは、主にCSS初心者・中級者の方を対象にしたCSSに関するアレコレがつまったサイトです。 プロパティやセレクタなどのリファレンスに加え、実践的なレイアウト講座やTips・コラムなど、それとCSS3に関してもちょこちょこ書いてます。 詳しい説明や、初めて訪れた方は「サイト説明」を読んで頂ければと...</p><p><a href="https://b.hatena.ne.jp/entry/zero.css-happylife.com/"><img src="https://b.hatena.ne.jp/entry/image/http://zero.css-happylife.com/" alt="はてなブックマーク - CSS HappyLife ZERO" title="はてなブックマーク - CSS HappyLife ZERO" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/zero.css-happylife.com/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 335 https://www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html 勘違いしてた TaRO 2011-10-20T12:35:01Z css <blockquote cite="https://www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html" title=":after 擬似要素 (当該要素の直後) - CSS リファレンス"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.marguerite.jp%2FNihongo%2FWWW%2FRefCSS%2FSelectors%2FPseudo%2Fafter.html" alt="" /> <a href="https://www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html">:after 擬似要素 (当該要素の直後) - CSS リファレンス</a></cite><p><a href="https://www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/4848392412a9143a91b3b55d8174d83c494a1dc9/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fwww.marguerite.jp%2FFeatures%2F%25E3%2581%2582%25E3%2581%25A3%25E3%2581%258D%25E3%2582%2585%25E3%2582%2593%25E5%25A0%2580%25E5%258C%2597%25E7%259C%259F%25E5%25B8%258C%25E3%2581%2586%25E3%2581%2595%25E3%2581%258E.GIF" alt=":after 擬似要素 (当該要素の直後) - CSS リファレンス" title=":after 擬似要素 (当該要素の直後) - CSS リファレンス" class="entry-image" /></a></p><p>平成27年12月15日現在の定義です。 定義 当該要素の直後 定義のある水準 第二水準 (CSS 2) 以降。 WAP 2.0 での定義 無し。 書式 第二水準での書式： セレクタ:after 第三水準での書式： セレクタ::after いずれも、セレクタは不要なら省略可。 :after 擬似要素とは。 :after 擬似要素とは、当該要素の直後となる擬似要...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html"><img src="https://b.hatena.ne.jp/entry/image/https://www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html" alt="はてなブックマーク - :after 擬似要素 (当該要素の直後) - CSS リファレンス" title="はてなブックマーク - :after 擬似要素 (当該要素の直後) - CSS リファレンス" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.marguerite.jp/Nihongo/WWW/RefCSS/Selectors/Pseudo/after.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 4 https://coliss.com/articles/web-services/online-tools-for-css-development.html TaRO 2011-10-19T13:25:46Z CSS <blockquote cite="https://coliss.com/articles/web-services/online-tools-for-css-development.html" title="スタイルシート関連の便利なオンラインツールのまとめ"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fweb-services%2Fonline-tools-for-css-development.html" alt="" /> <a href="https://coliss.com/articles/web-services/online-tools-for-css-development.html">スタイルシート関連の便利なオンラインツールのまとめ</a></cite><p><a href="https://coliss.com/articles/web-services/online-tools-for-css-development.html"><img src="" alt="スタイルシート関連の便利なオンラインツールのまとめ" title="スタイルシート関連の便利なオンラインツールのまとめ" class="entry-image" /></a></p><p>スタイルシートの制作、確認などに役立つ、便利なオンラインツールを紹介します。 [ad#ad-2] ジェネレーター：ベーシック系 ジェネレーター：ボタン、画像使わない系 制作補助、診断、確認 リファレンス、対応ブラウザなど ジェネレーター：ベーシック系</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/web-services/online-tools-for-css-development.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/web-services/online-tools-for-css-development.html" alt="はてなブックマーク - スタイルシート関連の便利なオンラインツールのまとめ" title="はてなブックマーク - スタイルシート関連の便利なオンラインツールのまとめ" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/web-services/online-tools-for-css-development.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 384 https://kojika17.com/2011/04/float-clearfix.html TaRO 2011-10-17T07:57:47Z css tips webdesign <blockquote cite="https://kojika17.com/2011/04/float-clearfix.html" title="float解除の決定版。clearfixを考えたら、進化した。"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fkojika17.com%2F2011%2F04%2Ffloat-clearfix.html" alt="" /> <a href="https://kojika17.com/2011/04/float-clearfix.html">float解除の決定版。clearfixを考えたら、進化した。</a></cite><p><a href="https://kojika17.com/2011/04/float-clearfix.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/dfed7e19da80fa78616b37ac0993a135376ca898/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fkojika17.com%2Fog.png" alt="float解除の決定版。clearfixを考えたら、進化した。" title="float解除の決定版。clearfixを考えたら、進化した。" class="entry-image" /></a></p><p>現在この中でclearfixでよく使用されているプロパティは display:inline-block; height:1%(min-height:1%) zoom:1; でも良く考えたら、全て微妙です。 zoom:1はIEの独自仕様ですし、heightを使用する場合は、IE6,7に対応させるために2つのプロパティが必要です。 display:inline-blockもボックスの要素を変形させること...</p><p><a href="https://b.hatena.ne.jp/entry/s/kojika17.com/2011/04/float-clearfix.html"><img src="https://b.hatena.ne.jp/entry/image/https://kojika17.com/2011/04/float-clearfix.html" alt="はてなブックマーク - float解除の決定版。clearfixを考えたら、進化した。" title="はてなブックマーク - float解除の決定版。clearfixを考えたら、進化した。" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/kojika17.com/2011/04/float-clearfix.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 928 http://blog.d-spica.com/entry/070307clearfix.html TaRO 2011-10-17T07:55:15Z css tips <blockquote cite="http://blog.d-spica.com/entry/070307clearfix.html" title="clearfixでfloatを解除 | d-spica"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fblog.d-spica.com%2Fentry%2F070307clearfix.html" alt="" /> <a href="http://blog.d-spica.com/entry/070307clearfix.html">clearfixでfloatを解除 | d-spica</a></cite><p><a href="http://blog.d-spica.com/entry/070307clearfix.html"><img src="" alt="clearfixでfloatを解除 | d-spica" title="clearfixでfloatを解除 | d-spica" class="entry-image" /></a></p><p>clearfixでfloatを解除 2007-03-07 1 0 XHTML/CSS clear, CSS 枠や背景が消えたり，途中で切れたりしたことはありませんか。 floatした要素（ボックス）を含む親要素（ボックス）のborderやbackgroundが途中で切れてしまうことがあります。 左の例では，右側のメニューが終わったあたりで，左右にあるラインも切れていま...</p><p><a href="https://b.hatena.ne.jp/entry/blog.d-spica.com/entry/070307clearfix.html"><img src="https://b.hatena.ne.jp/entry/image/http://blog.d-spica.com/entry/070307clearfix.html" alt="はてなブックマーク - clearfixでfloatを解除 | d-spica" title="はてなブックマーク - clearfixでfloatを解除 | d-spica" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/blog.d-spica.com/entry/070307clearfix.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 475 https://www.colorzilla.com/gradient-editor/ css3のグラデーション生成 TaRO 2011-10-17T03:42:34Z css webdesign tool <blockquote cite="https://www.colorzilla.com/gradient-editor/" title="Ultimate CSS Gradient Generator from ColorZilla"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.colorzilla.com%2Fgradient-editor%2F" alt="" /> <a href="https://www.colorzilla.com/gradient-editor/">Ultimate CSS Gradient Generator from ColorZilla</a></cite><p><a href="https://www.colorzilla.com/gradient-editor/"><img src="" alt="Ultimate CSS Gradient Generator from ColorZilla" title="Ultimate CSS Gradient Generator from ColorZilla" class="entry-image" /></a></p><p>background: linear-gradient(); /* W3C, IE10+, FF16+, Chrome 26+, Opera 12+, Safari 7+ */</p><p><a href="https://b.hatena.ne.jp/entry/s/www.colorzilla.com/gradient-editor/"><img src="https://b.hatena.ne.jp/entry/image/https://www.colorzilla.com/gradient-editor/" alt="はてなブックマーク - Ultimate CSS Gradient Generator from ColorZilla" title="はてなブックマーク - Ultimate CSS Gradient Generator from ColorZilla" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.colorzilla.com/gradient-editor/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 1388 https://www.coolwebwindow.com/csstips/csstechnic/000241.php TaRO 2011-10-17T02:19:40Z css tips <blockquote cite="https://www.coolwebwindow.com/csstips/csstechnic/000241.php" title="floatで並べたリストを中央揃えする - CSSデザインノート"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.coolwebwindow.com%2Fcsstips%2Fcsstechnic%2F000241.php" alt="" /> <a href="https://www.coolwebwindow.com/csstips/csstechnic/000241.php">floatで並べたリストを中央揃えする - CSSデザインノート</a></cite><p><a href="https://www.coolwebwindow.com/csstips/csstechnic/000241.php"><img src="" alt="floatで並べたリストを中央揃えする - CSSデザインノート" title="floatで並べたリストを中央揃えする - CSSデザインノート" class="entry-image" /></a></p><p>404 Not Found お探しのファイルは見つからないようです。 お手数ですが、下記リンクからトップページへお戻りください。 CoolWebWindow Copyright (C) Cool Web Window All Rights Reserved</p><p><a href="https://b.hatena.ne.jp/entry/s/www.coolwebwindow.com/csstips/csstechnic/000241.php"><img src="https://b.hatena.ne.jp/entry/image/https://www.coolwebwindow.com/csstips/csstechnic/000241.php" alt="はてなブックマーク - floatで並べたリストを中央揃えする - CSSデザインノート" title="はてなブックマーク - floatで並べたリストを中央揃えする - CSSデザインノート" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.coolwebwindow.com/csstips/csstechnic/000241.php"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 71 https://w3g.jp/webstandards/hack/css_block_control TaRO 2011-10-16T17:25:38Z css tips <blockquote cite="https://w3g.jp/webstandards/hack/css_block_control" title="CSS によるブロックレベル要素の左右中央揃え"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fw3g.jp%2Fwebstandards%2Fhack%2Fcss_block_control" alt="" /> <a href="https://w3g.jp/webstandards/hack/css_block_control">CSS によるブロックレベル要素の左右中央揃え</a></cite><p><a href="https://w3g.jp/webstandards/hack/css_block_control"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/a234f376021e1042412e1f23a4e9fdac44070bb3/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fweb.w3g.jp%2Fogp.png" alt="CSS によるブロックレベル要素の左右中央揃え" title="CSS によるブロックレベル要素の左右中央揃え" class="entry-image" /></a></p><p>Updated 2006.04.21 / Published 2006.04.21 Internet Explorer6のシェアが全盛期だったころ、初心者が CSS を使ったデザインでつまづく（失敗する）ことが多い事例に text-alignプロパティの誤用がありました。本文書では、CSS デザインによる論理構造と表現（見栄え）とを分離させる一歩として div要素の align属性や ...</p><p><a href="https://b.hatena.ne.jp/entry/s/w3g.jp/webstandards/hack/css_block_control"><img src="https://b.hatena.ne.jp/entry/image/https://w3g.jp/webstandards/hack/css_block_control" alt="はてなブックマーク - CSS によるブロックレベル要素の左右中央揃え" title="はてなブックマーク - CSS によるブロックレベル要素の左右中央揃え" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/w3g.jp/webstandards/hack/css_block_control"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 70 https://bashalog.c-brains.jp/11/10/13-200523.php TaRO 2011-10-15T13:12:15Z css tips <blockquote cite="https://bashalog.c-brains.jp/11/10/13-200523.php" title="cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fbashalog.c-brains.jp%2F11%2F10%2F13-200523.php" alt="" /> <a href="https://bashalog.c-brains.jp/11/10/13-200523.php">cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。</a></cite><p><a href="https://bashalog.c-brains.jp/11/10/13-200523.php"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/5daa55489c1ad26a219643d0705eb421667c6fc1/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fbashalog.c-brains.jp%2Fimages%2Fcat_coding.png" alt="cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。" title="cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。" class="entry-image" /></a></p><p>iPhone 4Sが発売間近。 買おうか迷って一旦諦めたはずがまた迷い始めました、hakoishiです。 Siriに甘い言葉をささやきたい。英語できないけど。 さて、コーディングで縦中央にオブジェクトを配置したいことって少なくないですよね。 しかしながら、cssはそういうのちょっと苦手。 「ほら、あの時使ったアレだよアレ！」...</p><p><a href="https://b.hatena.ne.jp/entry/s/bashalog.c-brains.jp/11/10/13-200523.php"><img src="https://b.hatena.ne.jp/entry/image/https://bashalog.c-brains.jp/11/10/13-200523.php" alt="はてなブックマーク - cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。" title="はてなブックマーク - cssで縦方向中央に配置する方法（5つのケース＋1） | バシャログ。" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/bashalog.c-brains.jp/11/10/13-200523.php"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 577 https://skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/ TaRO 2011-10-07T05:17:58Z css webdesign template <blockquote cite="https://skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/" title="12 HTML5 CSS3 Beautifully Designed Themes - SkyTechGeek"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fskytechgeek.com%2F2011%2F09%2F11-html5-css3-beautifully-designed-themes%2F" alt="" /> <a href="https://skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/">12 HTML5 CSS3 Beautifully Designed Themes - SkyTechGeek</a></cite><p><a href="https://skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/893381f73f2fb6a5d14fa871d286099837c7df5a/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fskytechgeek.com%2Fwp-content%2Fuploads%2F2011%2F09%2FHTML5_CSS3_THEMES_STG.jpg" alt="12 HTML5 CSS3 Beautifully Designed Themes - SkyTechGeek" title="12 HTML5 CSS3 Beautifully Designed Themes - SkyTechGeek" class="entry-image" /></a></p><p>The World Wide Web’s markup language has always been HTML. HTML was primarily designed as a language for semantically describing scientific documents, although its general design and adaptations over the years have enabled it to be used to describe a number of other types of documents. With the i...</p><p><a href="https://b.hatena.ne.jp/entry/s/skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/"><img src="https://b.hatena.ne.jp/entry/image/https://skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/" alt="はてなブックマーク - 12 HTML5 CSS3 Beautifully Designed Themes - SkyTechGeek" title="はてなブックマーク - 12 HTML5 CSS3 Beautifully Designed Themes - SkyTechGeek" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/skytechgeek.com/2011/09/11-html5-css3-beautifully-designed-themes/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 20 https://www.templatemo.com/page/1 TaRO 2011-10-07T03:43:18Z css webdesign template <blockquote cite="https://www.templatemo.com/page/1" title="Page 1 - Free CSS Templates"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.templatemo.com%2Fpage%2F1" alt="" /> <a href="https://www.templatemo.com/page/1">Page 1 - Free CSS Templates</a></cite><p><a href="https://www.templatemo.com/page/1"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/4f32e235cc506a3feff50be8161dcb87ef7a45b4/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Ftemplatemo.com%2Fbanners%2Ftemplatemo_600x400_2.jpg" alt="Page 1 - Free CSS Templates" title="Page 1 - Free CSS Templates" class="entry-image" /></a></p><p>600+ Free HTML CSS Templates Discover 600+ Free HTML CSS Website Templates. Starting this year, we&#39;re launching AI-customizable pure CSS designs alongside our responsive Bootstrap layouts. Generate and personalize modern templates instantly with our new AI-powered collection. All 100% free for co...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.templatemo.com/page/1"><img src="https://b.hatena.ne.jp/entry/image/https://www.templatemo.com/page/1" alt="はてなブックマーク - Page 1 - Free CSS Templates" title="はてなブックマーク - Page 1 - Free CSS Templates" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.templatemo.com/page/1"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 28