kledgeb Ubuntuの使い方や日本語化、アプリの使い方を紹介しています。

展開した略記をさらに加工するフィルターの使い方

  略記を展開すると、HTMLが出力されます。
  この出力された内容をさらに加工する「フィルター」が提供されています。

  フィルターは、シェルスクリプトのパイプと同じ考え方です。

  フィルターのフォーマット

    フィルターのフォーマットは、以下のようになります。

略記|フィルターの識別子|フィルターの識別子・・・

コメントを挿入するフィルター

  要素の前後にコメントを挿入するフィルターです。
  フィルターの識別子は「c」です。

  コメントには、id属性の値とclass属性の値が挿入されます。

  1-1.略記の入力

    単純な例です。
    ここでは例として、以下のように入力します。


div#div1|c

  1-2.略記の展開

    略記を展開すると、以下のように要素が展開されます。
    id属性の値がコメントに展開されています。


  2-1.略記の入力

    少し複雑にした例です。
    ここでは例として、以下のように入力します。


div#div1>div.clsdiv2>div#div3.clsdiv3|c

  2-2.略記の展開

    略記を展開すると、以下のように要素が展開されます。
    id属性の値やclass属性の値がコメントに展開されています。


文字をエスケープするフィルター

  文字をエスケープするフィルターです。
  以下の文字をエスケープします。

対象になる文字 エスケープ後の文字
< &lt;
> &gt;
& &amp;

  フィルターの識別子は「e」です。

  1.略記の入力

    ここでは例として、以下のように入力します。


div|e

  2.略記の展開

    文字がエスケープされ展開されています。


CSSのスペースを調整するフィルター

  CSSのスペースを調整するフィルターです。
  フィルターの識別子は「fc」です。

  通常CSSの略記を展開すると、各宣言は以下のように展開されます。


  このフィルターを通すことで、プロパティーの値の先頭にスーペース文字が挿入されます。

  1.略記の入力

    ここでは例として、以下のように入力します。



cl:n|fc

  2.略記の展開

    以下のように、プロパティーの値の先頭にスーペース文字が挿入されます。



関連コンテンツ
同一カテゴリーの記事
コメント
オプション