タグ

ブックマーク / qiita.com/hbsnow (3)

  • CSSのスコープ - Qiita

    この記事の内容についてのほとんどが対応ブラウザの少ないものなので、現段階でそのまま実際に使えるものではない。Polymerで使用されているCSSを初見でわりと理解できなかったかつての自分用メモです。Polymerの解説ではなくて仕様の整理なので注意。 scoped属性 これは直感的でわかりやすくて、HTML内部に直接style要素を挿入してscoped属性をつけるだけ。scoped属性をもつ要素はフローコンテンツが許容される最初の子要素である必要があって、場合によってはそのstyle要素をラップする親要素が必要になることもある。 <p>この文章にはスタイルが適用されません。</p> <div> <style scoped> p { color: red; } </style> <p>この文章は文字が赤くなります。</p> </div> 嫌がらせ以外で誰が使うんだろうかとおもっていたんだけど

    CSSのスコープ - Qiita
  • PostCSSの基本的なプラグインについて - Qiita

    自分のサイトのSCSSをPostCSSに書き換えたので、そのときに調べたことをメモしておく。プラグインパックであるcssnextはなにがどう変換されているか把握できなくなりそうなので使わずに、個別でインストールしていく方針。どんなサイトでも基的に使うだろうな、というものだけメモしておく。 ここで書いたもので不足を感じたときにReadmeに書かれているものなりPostCSS.partsにあるプラグインを試せばいいとおもう。ただ最後にもすこし触れるけど、なんでも便利そうだからと入れて使うのはやめたほうがいいとおもう。 SCSSからの移行であればprecssがよさそう。ただ自分が使ったときはcssnanoと併用したときに、importしたファイルをうまくminifyできていませんでした。 記法 postcss-import @importしたファイルを展開する。最初によみこまないと以降に紹介す

    PostCSSの基本的なプラグインについて - Qiita
  • 静的サイトをMetalsmithでビルドし、Github Pagesにwerckerでデプロイする - Qiita

    Metalsmithはやりたいことをプラグインで導入していくスタイルなので、若干のとっつきにくさはあるかもしれません。ただ、だいたいの仕組みとよく使うプラグインを把握してしまえばあとは自由にサイトを作ることができるようになってくるので、Node製でそういったものを求めているのであればMetalsmithが最良の選択になりそう。自分が使っているプラグインの可能性もあるけれども、ビルドは他のジェネレータと比較して、それほど早いといった感じはないなので記事数が膨大の場合には微妙なのかもしれない。 hbsnow/4uing.net 自分のサイトも今のところMetalsmithで作成しています。 インストール まずはMetalsmithをインストール。 CLIを使う場合にはグローバルにインストールするのが普通なんだろうけど、CLIは使わないので普通にインストールしていきます。 これだけではほとんど何

    静的サイトをMetalsmithでビルドし、Github Pagesにwerckerでデプロイする - Qiita
  • 1