oitake blog

いろいろリンク

おすすめリンク

最近のエントリー

カテゴリー

20101012:コメントとトラックバックを停止したことにより、このサイトはアーカイブとなりました。以降、ご連絡はみもねるのウェブサイトへお願いします。
20100703:新ナマコメ(ナマコメ 2)を公開しました。コメントビューア付きで送信面においてもパワーアップしています。
旧ナマコメは将来的に使用できなくする予定なので、可能な限り新ナマコメをお使いください。
20091127:oitake は みもねる になりました。当ブログは無期限更新停止となります。詳細は最新の記事をご覧ください。

スポンサーサイト

一定期間更新がないため広告を表示しています


2009.12.16 Wednesday | | - | - | -

HTML2CSS:機能を(本家並みに)強化したデラックス版

先日ご紹介したHTML2CSSのデラックス版をリリースします。機能とデザインが強化されているので、前回のブクマを使っている方もこちらをお使いください。
なお、oitakeのHTML2CSSは、Jonathan Holstさんが作られたHTML2CSSにインスパイアされて作ったものです。oitakeのは機能的に不完全ですが、ブックマークレットから簡単に呼び出せるメリットがあります。

HTML2CSS デラックス版

上のリンクをお気に入りやブックマークレットに登録、任意のページで呼び出してください。ページ上部にHTMLから生成された空のCSSが表示されます。
IEをお使いの方は「Copy CSS」をクリックしてください。CSSをコピーすることができます。

シンプル版(旧版)ではネストされた要素を列挙できませんでしたが、デラックス版では全ての要素を列挙できます。例えばこんな感じです。

div {
}
div#all {
}
div#all img {
}
div#all div#main {
}

(中略)

div#all div#main div#menu img {
}
div#all div#footer {
}
div#all div#footer div {
}
div#all div#footer a {
}

ただし、class属性もid属性もない要素の子要素は(故意に)列挙しません。

<div><strong>このstrong要素は無視されます。</strong></div>

また、ふたつ以上のclass属性値には未対応です。

div#all div#main div.entry div.block!text {
}

セパレータの半角スペースを「!」に変換するだけなので注意してください。
最終的にはテキストエディタ上で何らかの置換作業を行うことになりそうです。次のような長いセレクタはid属性の親要素を削除することで簡略化できます。

div#all div#main div#menu div.list div.links#ad div.linktext img {
}

複雑な構造のウェブページでは使わない方が良いかもしれませんね。

※前回、縦書きのアップグレード版をリリースすると書きましたが、めっさ面倒くさいことに気が付いたので、また今度。

スポンサーサイト


2009.12.16 Wednesday | 17:26 | - | - | -

コメント

こんにちはー。初めまして。
記事と関係なくてすみません。

さきほど商品を買わせていただきました。

kuma plateです。
早速使ってみようと思って装着したのですが
頭の上に来てしまいました(笑
装着では使えないのですか?

初心者でわからない事がおおくて。。。
こんな初歩的な質問ですが教えて下さい(;´▽`A``
よろしくお願いします。

他の商品もメッチャ気になってますw
りりたむ | 2007/09/03 11:49 AM
装着では使えません。地面に置いて、それから座ってください。
どうも説明不足で申し訳ないです(・・;
oitake | 2007/09/04 8:31 AM