https://b.hatena.ne.jp/simomm/CSS/ CSSに関するsimommのはてなブックマーク (16) https://coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html simomm 2020-12-31T01:25:28Z フロントエンド frontend ソフトウェア開発 プログラミング programming ページ表示速度 HTML css <blockquote cite="https://coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html" title="Webページ高速化に必須の知識！ブラウザがWebページをどのようにレンダリングしているか、図を用いて解説"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fwork%2Fhow-the-browser-renders-a-web-page.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html">Webページ高速化に必須の知識！ブラウザがWebページをどのようにレンダリングしているか、図を用いて解説</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/cda08d1ba67150868e88c9a9aa0242bedd1252b9/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-202004%2F2020110701%402x.png" alt="Webページ高速化に必須の知識！ブラウザがWebページをどのようにレンダリングしているか、図を用いて解説" title="Webページ高速化に必須の知識！ブラウザがWebページをどのようにレンダリングしているか、図を用いて解説" class="entry-image" /></a></p><p>ブラウザがWebページをどのようにレンダリングしているか、図を用いてやさしく解説した記事を紹介します。 レンダリングの仕組みを理解することで、HTMLやCSSやJavaScriptなど実装時にも気をつける点があります。 How the browser renders a web page by James Starkie 下記は各ポイントを意訳したものです。 ※当ブログ...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html" alt="はてなブックマーク - Webページ高速化に必須の知識！ブラウザがWebページをどのようにレンダリングしているか、図を用いて解説" title="はてなブックマーク - Webページ高速化に必須の知識！ブラウザがWebページをどのようにレンダリングしているか、図を用いて解説" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/work/how-the-browser-renders-a-web-page.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 1127 https://zenn.dev/tak_dcxi/articles/588fbc205251043dc357 simomm 2020-12-30T23:40:19Z web制作 webデザイン css frontend フロントエンド フォント <blockquote cite="https://zenn.dev/tak_dcxi/articles/588fbc205251043dc357" title="デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fzenn.dev%2Ftak_dcxi%2Farticles%2F588fbc205251043dc357" alt="" /> <a href="https://zenn.dev/tak_dcxi/articles/588fbc205251043dc357">デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話</a></cite><p><a href="https://zenn.dev/tak_dcxi/articles/588fbc205251043dc357"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/eca9cd5d1ccd6c869baecedb458aac55a7e3ea77/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--xIaPDTLF--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3A%2525E3%252583%252587%2525E3%252582%2525B6%2525E3%252582%2525A4%2525E3%252583%25258A%2525E3%252583%2525BC%2525E3%252581%2525A8%2525E3%252583%252595%2525E3%252583%2525AD%2525E3%252583%2525B3%2525E3%252583%252588%2525E3%252582%2525A8%2525E3%252583%2525B3%2525E3%252583%252589%2525E3%252582%2525A8%2525E3%252583%2525B3%2525E3%252582%2525B8%2525E3%252583%25258B%2525E3%252582%2525A2%2525E3%252581%2525AB%2525E7%25259F%2525A5%2525E3%252581%2525A3%2525E3%252581%2525A6%2525E3%252581%2525BB%2525E3%252581%252597%2525E3%252581%252584Web%2525E3%252581%2525AE%2525E3%252583%252595%2525E3%252582%2525A9%2525E3%252583%2525B3%2525E3%252583%252588%2525E5%252591%2525A8%2525E3%252582%25258A%2525E3%252581%2525AE%2525E3%252581%25258A%2525E8%2525A9%2525B1%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_37%3ATAK%252Cx_203%252Cy_121%2Fg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyLzExYmUzMzJmNzAuanBlZw%3D%3D%252Cr_max%252Cw_90%252Cx_87%252Cy_95%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png%3F_a%3DBACAGSGT" alt="デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話" title="デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話" class="entry-image" /></a></p><p>こんにちは。TAK(@tak_dcxi)です。 今回記事にするのはタイトル通り「デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周り」についてです。以前ツイートしましたが、特に説明もなかったので自分の備忘録も兼ねて。 Androidに明朝体は無い Apple製品しか利用しないデザイナーの方に話したら非常に驚か...</p><p><a href="https://b.hatena.ne.jp/entry/s/zenn.dev/tak_dcxi/articles/588fbc205251043dc357"><img src="https://b.hatena.ne.jp/entry/image/https://zenn.dev/tak_dcxi/articles/588fbc205251043dc357" alt="はてなブックマーク - デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話" title="はてなブックマーク - デザイナーとフロントエンドエンジニアに知ってほしいWebのフォント周りのお話" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/zenn.dev/tak_dcxi/articles/588fbc205251043dc357"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 569 https://qiita.com/snakada/items/07347d6ad10ae661fbc6 simomm 2020-05-04T05:55:49Z フロントエンド frontend javascript css HTML web制作 ソフトウェア開発 programming プログラミング <blockquote cite="https://qiita.com/snakada/items/07347d6ad10ae661fbc6" title="フロントエンドエンジニア御用達の MDN web docs を網羅した"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fqiita.com%2Fsnakada%2Fitems%2F07347d6ad10ae661fbc6" alt="" /> <a href="https://qiita.com/snakada/items/07347d6ad10ae661fbc6">フロントエンドエンジニア御用達の MDN web docs を網羅した</a></cite><p><a href="https://qiita.com/snakada/items/07347d6ad10ae661fbc6"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/4898c42d305787eb1240f65077bfec10b092207d/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUUzJTgzJTk1JUUzJTgzJUFEJUUzJTgzJUIzJUUzJTgzJTg4JUUzJTgyJUE4JUUzJTgzJUIzJUUzJTgzJTg5JUUzJTgyJUE4JUUzJTgzJUIzJUUzJTgyJUI4JUUzJTgzJThCJUUzJTgyJUEyJUU1JUJFJUExJUU3JTk0JUE4JUU5JTgxJTk0JUUzJTgxJUFFJTIwTUROJTIwd2ViJTIwZG9jcyUyMCVFMyU4MiU5MiVFNyVCNiVCMiVFNyVCRSU4NSVFMyU4MSU5NyVFMyU4MSU5RiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9NjRkYmVkNjQ1ZjliNjJkY2E3NmI0MDE5M2RmNGJmMzQ%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBzbmFrYWRhJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0yZjAxMTkxMWEzMjk3OWNkNjI2M2NmZWRkZTNkZDZhZg%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4g44Om44Of44Or44Oq44Oz44Kv5qCq5byP5Lya56S-%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%25231E2121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3D6e3a946d49fef4aa0e71431e80fe918d" alt="フロントエンドエンジニア御用達の MDN web docs を網羅した" title="フロントエンドエンジニア御用達の MDN web docs を網羅した" class="entry-image" /></a></p><p>Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? このリストは何？ MDN web docs を、あたかも書籍の目次かのごとく整理しなおしたものです。それぞれ MDN web docs の記事へリンクしています。 なぜこれが必要になったかというと...</p><p><a href="https://b.hatena.ne.jp/entry/s/qiita.com/snakada/items/07347d6ad10ae661fbc6"><img src="https://b.hatena.ne.jp/entry/image/https://qiita.com/snakada/items/07347d6ad10ae661fbc6" alt="はてなブックマーク - フロントエンドエンジニア御用達の MDN web docs を網羅した" title="はてなブックマーク - フロントエンドエンジニア御用達の MDN web docs を網羅した" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/qiita.com/snakada/items/07347d6ad10ae661fbc6"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 553 https://nabettu.hatenablog.com/entry/frontendresume simomm 2018-07-16T05:15:48Z javascript css プログラミング フロントエンド development 開発 HTML ソフトウェア開発 <blockquote cite="https://nabettu.hatenablog.com/entry/frontendresume" title="フロントエンドエンジニアに求められるもの多すぎ問題 - フロントエンドの地獄"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fnabettu.hatenablog.com%2Fentry%2Ffrontendresume" alt="" /> <a href="https://nabettu.hatenablog.com/entry/frontendresume">フロントエンドエンジニアに求められるもの多すぎ問題 - フロントエンドの地獄</a></cite><p><a href="https://nabettu.hatenablog.com/entry/frontendresume"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/a6a14829e1718aa0305065d43268f5b83a864763/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F619440551b50ec12719fd4560c3b275db8a84e09%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttps%253A%252F%252Fcdn.user.blog.st-hatena.com%252Fdefault_entry_og_image%252F45555431%252F1514243435688759" alt="フロントエンドエンジニアに求められるもの多すぎ問題 - フロントエンドの地獄" title="フロントエンドエンジニアに求められるもの多すぎ問題 - フロントエンドの地獄" class="entry-image" /></a></p><p>背景 postd.cc という記事がちょっと前にありました。 github.com Roadmap to becoming a web developer in 2018って最近のWeb技術のまとめみたいなもんもよく引き合いに出されます。 このまとめの中にフロントエンドのものありますが、これはフロントエンド技術自体のロードマップです。 これらの技術すべてに精通して...</p><p><a href="https://b.hatena.ne.jp/entry/s/nabettu.hatenablog.com/entry/frontendresume"><img src="https://b.hatena.ne.jp/entry/image/https://nabettu.hatenablog.com/entry/frontendresume" alt="はてなブックマーク - フロントエンドエンジニアに求められるもの多すぎ問題 - フロントエンドの地獄" title="はてなブックマーク - フロントエンドエンジニアに求められるもの多すぎ問題 - フロントエンドの地獄" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/nabettu.hatenablog.com/entry/frontendresume"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 505 https://note.com/daikawai/n/nf5bdcba44182 simomm 2018-06-24T12:26:31Z プログラミング HTML programming 開発 css ソフトウェア開発 <blockquote cite="https://note.com/daikawai/n/nf5bdcba44182" title="【保存版】プログラミングで何を学べばどんなアプリを作れるのかまとめてみました。｜Dai"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fnote.com%2Fdaikawai%2Fn%2Fnf5bdcba44182" alt="" /> <a href="https://note.com/daikawai/n/nf5bdcba44182">【保存版】プログラミングで何を学べばどんなアプリを作れるのかまとめてみました。｜Dai</a></cite><p><a href="https://note.com/daikawai/n/nf5bdcba44182"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/fbc2f8d71522b802c7788749480cbe0dbbdbdfcf/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fassets.st-note.com%2Fproduction%2Fuploads%2Fimages%2F6923400%2Frectangle_large_type_2_b43fc9c2e24197861a667a8978dc2acf.jpg%3Ffit%3Dbounds%26quality%3D85%26width%3D1280" alt="【保存版】プログラミングで何を学べばどんなアプリを作れるのかまとめてみました。｜Dai" title="【保存版】プログラミングで何を学べばどんなアプリを作れるのかまとめてみました。｜Dai" class="entry-image" /></a></p><p>追記） プログラミング教育・就活などについてツイッターでも発信しています。この記事を読んで興味を持っていただけた方がぜひフォローよろしくお願いします！ ------------------------------------------------------------------------- プログラミングで「これ創りたい！」というときに何を学んだらいいのか創りた...</p><p><a href="https://b.hatena.ne.jp/entry/s/note.com/daikawai/n/nf5bdcba44182"><img src="https://b.hatena.ne.jp/entry/image/https://note.com/daikawai/n/nf5bdcba44182" alt="はてなブックマーク - 【保存版】プログラミングで何を学べばどんなアプリを作れるのかまとめてみました。｜Dai" title="はてなブックマーク - 【保存版】プログラミングで何を学べばどんなアプリを作れるのかまとめてみました。｜Dai" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/note.com/daikawai/n/nf5bdcba44182"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 980 https://speakerdeck.com/ken_c_lo/zurui-design simomm 2013-01-17T12:18:04Z web制作 Webデザイン design デザイン css <blockquote cite="https://speakerdeck.com/ken_c_lo/zurui-design" title="少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fspeakerdeck.com%2Fken_c_lo%2Fzurui-design" alt="" /> <a href="https://speakerdeck.com/ken_c_lo/zurui-design">少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck</a></cite><p><a href="https://speakerdeck.com/ken_c_lo/zurui-design"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/5b7f7637e9947dbeb849006944cedb82173738fa/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Ffiles.speakerdeck.com%2Fpresentations%2F508b975236b3f8000201a95e%2Fslide_0.jpg%3F240739" alt="少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck" title="少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck" class="entry-image" /></a></p><p>少ない手間と知識でそれなりに見せる、ズルいデザインテクニック with Sass / Compass (English Version) https://speakerdeck.com/ken_c_lo/zurui-design-technique-english-version 第一回…</p><p><a href="https://b.hatena.ne.jp/entry/s/speakerdeck.com/ken_c_lo/zurui-design"><img src="https://b.hatena.ne.jp/entry/image/https://speakerdeck.com/ken_c_lo/zurui-design" alt="はてなブックマーク - 少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck" title="はてなブックマーク - 少ない手間と知識でそれなりに見せる、ズルいデザインテクニック// Speaker Deck" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/speakerdeck.com/ken_c_lo/zurui-design"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 2612 https://coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html simomm 2012-08-08T12:32:04Z CSS CSS3 web design webデザイン UI Web制作 <blockquote cite="https://coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html" title="CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets | コリス"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fcss%2Fopen-source-ui-components-coded-with-html-and-css-and-sass.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html">CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets | コリス</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html"><img src="" alt="CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets | コリス" title="CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets | コリス" class="entry-image" /></a></p><p>すぐに使えてデザインも素敵、CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html" alt="はてなブックマーク - CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets | コリス" title="はてなブックマーク - CSS3で実装されたUIエレメントのオープンソースのまとめ -CSS3 Code Snippets | コリス" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/css/open-source-ui-components-coded-with-html-and-css-and-sass.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 326 https://unformedbuilding.com/articles/if-stuck-in-the-study-of-css/ simomm 2012-07-25T01:30:28Z webデザイン Web制作 css CSS3 HTML <blockquote cite="https://unformedbuilding.com/articles/if-stuck-in-the-study-of-css/" title="CSSの勉強中に困ったら"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Funformedbuilding.com%2Farticles%2Fif-stuck-in-the-study-of-css%2F" alt="" /> <a href="https://unformedbuilding.com/articles/if-stuck-in-the-study-of-css/">CSSの勉強中に困ったら</a></cite><p><a href="https://unformedbuilding.com/articles/if-stuck-in-the-study-of-css/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/019912161018e339663740eac7d0c5eb89fbd0e5/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Funformedbuilding.com%2Fassets%2Fimages%2Fog.png" alt="CSSの勉強中に困ったら" title="CSSの勉強中に困ったら" class="entry-image" /></a></p><p>CSSの勉強中に色々困ることが起きて検索するのですが、だいたい同じところに行き着くので自分用のリンク集も兼ねてまとめておきます。 仕様を確認するとりあえずW3Cを見に行った方が早い。 そもそもプロパティや値について分かっていない場合はここで解決することが多い。 CSS current work &amp; how to participate現在の...</p><p><a href="https://b.hatena.ne.jp/entry/s/unformedbuilding.com/articles/if-stuck-in-the-study-of-css/"><img src="https://b.hatena.ne.jp/entry/image/https://unformedbuilding.com/articles/if-stuck-in-the-study-of-css/" alt="はてなブックマーク - CSSの勉強中に困ったら" title="はてなブックマーク - CSSの勉強中に困ったら" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/unformedbuilding.com/articles/if-stuck-in-the-study-of-css/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 705 http://w3q.jp/t/2445 simomm 2012-07-05T03:29:28Z web制作 HTML tips css css3 HTML5 <blockquote cite="http://w3q.jp/t/2445" title="これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fw3q.jp%2Ft%2F2445" alt="" /> <a href="http://w3q.jp/t/2445">これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース</a></cite><p><a href="http://w3q.jp/t/2445"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/b0d554184c41cbc4829cee70b02c4d830131fce6/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fw3q.jp%2Fupload%2F2012%2F7%2F4%2Fl_2012-7-4_a50168c4234037a3420a02c3da13773e.jpg" alt="これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース" title="これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース" class="entry-image" /></a></p><p>HTML5 Please - Use the n... / CSS3 Click Chart | CSS3 ... / Mobile Web Resources | M...他...全5件</p><p><a href="https://b.hatena.ne.jp/entry/w3q.jp/t/2445"><img src="https://b.hatena.ne.jp/entry/image/http://w3q.jp/t/2445" alt="はてなブックマーク - これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース" title="はてなブックマーク - これからのWeb制作に使える、HTML5,CSS3の対応表や各種リソース" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/w3q.jp/t/2445"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 318 https://www.webcreatorbox.com/tech/css-sass simomm 2012-06-27T04:26:15Z css プログラミング web制作 HTML Webデザイン <blockquote cite="https://www.webcreatorbox.com/tech/css-sass" title="Introduction to Sass and How to Setup with Mac + Coda"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.webcreatorbox.com%2Ftech%2Fcss-sass" alt="" /> <a href="https://www.webcreatorbox.com/tech/css-sass">Introduction to Sass and How to Setup with Mac + Coda</a></cite><p><a href="https://www.webcreatorbox.com/tech/css-sass"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/dcceeba4e68544efc7ddd68c8846e6e719bacf2a/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fwww.webcreatorbox.com%2Fwp-content%2Fuploads%2F2012%2F06%2Fsass.jpg" alt="Introduction to Sass and How to Setup with Mac + Coda" title="Introduction to Sass and How to Setup with Mac + Coda" class="entry-image" /></a></p><p>2014年7月31日 CSS, 便利ツール 「Sass」って聞いたことありますか？すっごく簡単に言うと、CSSをもっと便利に・効率良く記述するためのものです。とは言え基本的な書き方はCSSと同じなので、「新しいプログラミング言語」というより「CSSの新しい装備品」といったところでしょうか。一見難しく思えるかもしれませんが、...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.webcreatorbox.com/tech/css-sass"><img src="https://b.hatena.ne.jp/entry/image/https://www.webcreatorbox.com/tech/css-sass" alt="はてなブックマーク - Introduction to Sass and How to Setup with Mac + Coda" title="はてなブックマーク - Introduction to Sass and How to Setup with Mac + Coda" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.webcreatorbox.com/tech/css-sass"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 816 https://phpspot.org/blog/archives/2012/04/webchromependul.html simomm 2012-04-23T12:01:43Z web制作 Chrome アドオン extension Web開発 css <blockquote cite="https://phpspot.org/blog/archives/2012/04/webchromependul.html" title="WEB開発者はインストール必須のChrome拡張「Pendule」:phpspot開発日誌"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fphpspot.org%2Fblog%2Farchives%2F2012%2F04%2Fwebchromependul.html" alt="" /> <a href="https://phpspot.org/blog/archives/2012/04/webchromependul.html">WEB開発者はインストール必須のChrome拡張「Pendule」:phpspot開発日誌</a></cite><p><a href="https://phpspot.org/blog/archives/2012/04/webchromependul.html"><img src="" alt="WEB開発者はインストール必須のChrome拡張「Pendule」:phpspot開発日誌" title="WEB開発者はインストール必須のChrome拡張「Pendule」:phpspot開発日誌" class="entry-image" /></a></p><p>Chrome ウェブストア - Pendule WEB開発者はインストール必須のChrome拡張「Pendule」。 昔からあるChrome拡張ですが知らない間に色々と便利になっているようだったのでご紹介。 ４月からはたいている新入社員のWEBデベロッパーさんにもオススメ インストールすると以下のようなボタンが表示されますのでクリック。 まず...</p><p><a href="https://b.hatena.ne.jp/entry/s/phpspot.org/blog/archives/2012/04/webchromependul.html"><img src="https://b.hatena.ne.jp/entry/image/https://phpspot.org/blog/archives/2012/04/webchromependul.html" alt="はてなブックマーク - WEB開発者はインストール必須のChrome拡張「Pendule」:phpspot開発日誌" title="はてなブックマーク - WEB開発者はインストール必須のChrome拡張「Pendule」:phpspot開発日誌" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/phpspot.org/blog/archives/2012/04/webchromependul.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 674 http://weboook.blog22.fc2.com/blog-entry-315.html simomm 2012-04-18T16:37:54Z webデザイン CSS Web制作 jQuery css3 javascript IE <blockquote cite="http://weboook.blog22.fc2.com/blog-entry-315.html" title="CSS3 IE対策まとめ"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fweboook.blog22.fc2.com%2Fblog-entry-315.html" alt="" /> <a href="http://weboook.blog22.fc2.com/blog-entry-315.html">CSS3 IE対策まとめ</a></cite><p><a href="http://weboook.blog22.fc2.com/blog-entry-315.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/fb9ffc84cd9df070c143ff779d66c8cad639737c/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fblog-imgs-73.fc2.com%2Fw%2Fe%2Fb%2Fweboook%2Fwebpark-ogp.png" alt="CSS3 IE対策まとめ" title="CSS3 IE対策まとめ" class="entry-image" /></a></p><p>CSS3を使うにあたっていつも問題になるのが Internet Explorer（IE）です。CSS3への対応が遅い上に、旧バージョンを使い続けているユーザーも結構いますので、CSS3を使うことに躊躇する人も多いのではないでしょうか？ ということでCSS3を使うにあたって知っておきたいIE対策を紹介します。 1. CSS3の対応状況を確認する...</p><p><a href="https://b.hatena.ne.jp/entry/weboook.blog22.fc2.com/blog-entry-315.html"><img src="https://b.hatena.ne.jp/entry/image/http://weboook.blog22.fc2.com/blog-entry-315.html" alt="はてなブックマーク - CSS3 IE対策まとめ" title="はてなブックマーク - CSS3 IE対策まとめ" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/weboook.blog22.fc2.com/blog-entry-315.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 683 http://beyondiesix.jp/ simomm 2012-04-04T12:28:50Z web制作 webデザイン HTML CSS JQuery <blockquote cite="http://beyondiesix.jp/" title="Beyond IE Six: 未来のWebサイト制作のためのブースターキット"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fbeyondiesix.jp%2F" alt="" /> <a href="http://beyondiesix.jp/">Beyond IE Six: 未来のWebサイト制作のためのブースターキット</a></cite><p><a href="http://beyondiesix.jp/"><img src="" alt="Beyond IE Six: 未来のWebサイト制作のためのブースターキット" title="Beyond IE Six: 未来のWebサイト制作のためのブースターキット" class="entry-image" /></a></p><p>古いブラウザを利用することのデメリットや、便利で美しい Web へ飛び出すために必要な開発ツールやメリットを紹介。99% 第三者機関 NSS Labs のセキュリティ調査によると、IE9 は、ソーシャルエンジニアリングによるマルウェア（不正リンクなど）を 99% ブロックすると言われています (参考記事)。 他ベンダーのブラウ...</p><p><a href="https://b.hatena.ne.jp/entry/beyondiesix.jp/"><img src="https://b.hatena.ne.jp/entry/image/http://beyondiesix.jp/" alt="はてなブックマーク - Beyond IE Six: 未来のWebサイト制作のためのブースターキット" title="はてなブックマーク - Beyond IE Six: 未来のWebサイト制作のためのブースターキット" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/beyondiesix.jp/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 69 https://yusukebe.com/posts/2012/0304225231/ simomm 2012-03-05T17:04:34Z デザイン webデザイン css Web制作 HTML CSS Framework <blockquote cite="https://yusukebe.com/posts/2012/0304225231/" title="CSS Frameworkを持つ - ゆーすけべー日記"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fyusukebe.com%2Fposts%2F2012%2F0304225231%2F" alt="" /> <a href="https://yusukebe.com/posts/2012/0304225231/">CSS Frameworkを持つ - ゆーすけべー日記</a></cite><p><a href="https://yusukebe.com/posts/2012/0304225231/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/4d0782b74af001a2d2465ba0759b09f70ecb665e/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fyusukebe.com%2Ficons%2Fmyicon.png" alt="CSS Frameworkを持つ - ゆーすけべー日記" title="CSS Frameworkを持つ - ゆーすけべー日記" class="entry-image" /></a></p><p>例えば、Webサービスのフロントエンドのコードを書き始める時にまず何をするでしょうか？ デザインスケッチや画像を元にHTMLとCSSを記述していくことになると思います。 少なくとも僕はそうですね。 理論的にはHTMLだけでもWebサービスを作ることはもちろんできますが、 見た目を少しでも調整したいとなるとCSSが必要に...</p><p><a href="https://b.hatena.ne.jp/entry/s/yusukebe.com/posts/2012/0304225231/"><img src="https://b.hatena.ne.jp/entry/image/https://yusukebe.com/posts/2012/0304225231/" alt="はてなブックマーク - CSS Frameworkを持つ - ゆーすけべー日記" title="はてなブックマーク - CSS Frameworkを持つ - ゆーすけべー日記" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/yusukebe.com/posts/2012/0304225231/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 415 https://getbootstrap.com/2.3.2/ simomm 2012-02-01T10:58:02Z HTML webデザイン framework css UI プログラミング <blockquote cite="https://getbootstrap.com/2.3.2/" title="Components · Twitter Bootstrap"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fgetbootstrap.com%2F2.3.2%2F" alt="" /> <a href="https://getbootstrap.com/2.3.2/">Components · Twitter Bootstrap</a></cite><p><a href="https://getbootstrap.com/2.3.2/"><img src="" alt="Components · Twitter Bootstrap" title="Components · Twitter Bootstrap" class="entry-image" /></a></p><p>Sleek, intuitive, and powerful front-end framework for faster and easier web development. Download Bootstrap GitHub project Examples Extend Version 2.3.2</p><p><a href="https://b.hatena.ne.jp/entry/s/getbootstrap.com/2.3.2/"><img src="https://b.hatena.ne.jp/entry/image/https://getbootstrap.com/2.3.2/" alt="はてなブックマーク - Components · Twitter Bootstrap" title="はてなブックマーク - Components · Twitter Bootstrap" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/getbootstrap.com/2.3.2/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 2229 http://webdesignmatome.com/web-tips/html5matome simomm 2011-12-14T13:39:46Z HTML5 Web制作 css programming プログラミング <blockquote cite="http://webdesignmatome.com/web-tips/html5matome" title="Loading..."><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fwebdesignmatome.com%2Fweb-tips%2Fhtml5matome" alt="" /> <a href="http://webdesignmatome.com/web-tips/html5matome">Loading...</a></cite><p><a href="http://webdesignmatome.com/web-tips/html5matome"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/427d00a6ef17b5746328b2e917f246aef2e6b4f8/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fwebdesignmatome.com%2Fwp-content%2Fuploads%2F2011%2F12%2FA141.jpg" alt="Loading..." title="Loading..." class="entry-image" /></a></p><p></p><p><a href="https://b.hatena.ne.jp/entry/webdesignmatome.com/web-tips/html5matome"><img src="https://b.hatena.ne.jp/entry/image/http://webdesignmatome.com/web-tips/html5matome" alt="はてなブックマーク - Loading..." title="はてなブックマーク - Loading..." border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/webdesignmatome.com/web-tips/html5matome"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> 1603