【swellカスタマイズ】cssを部分定義する方法

SWELLで cssの部分定義をカスタマイズする
今まで 定義したCSSは
- 全体に効果がある
- ページ毎に効果がある
でしたね。
実はSWELLにはまだ細かく定義できる部分が残されてます。
実はこれが1番面白いかもw
実際の画面を見てみよう
ちょっとスクロールしてみてください。
MBP最高!
これらは各行のPタグに対して個別にCSSを効かせてます。
ただしこのエフェクトはjavascriptでスクロールを検知して発動させてます。
ページの下部にある カスタムCSS&JS の CSS用コードに CSSを記述して
編集ページの画面右側の ブロック 内の最下部にある 高度な設定 > 追加CSSクラス で
記述したCSSのclassを記入します。

ここで記述するとブロック単位で任意のCSSを発動させることが可能になりますので
夢が広がりまくりですね!
応用:同じように SWELLのエディターの標準機能であるこれも
このSWELLエディターで出現してくるお馴染みのTOOLバーの中でも
狭い範囲のCSSを指定できます。

上の画像のドロップダウンメニューの中に 太字 と Quicksand があるのが見えると思いますが
これは SWELL設定 > エディター設定 > カスタム書式 で設定できます。

これは 文字の太さと FONTの種類の指定のCSS 記述例 なのですが
インラインで 細かくCSSを指定できます。
例をあげると
- これはQuicksandではありません。 (指定無し)
- これはQuicksandです。 (Quicksandを指定)
- これはQuicksandではありません。 (太字のみ指定)
- これはQuicksandです。(太字とQuicksand)
みたいなことが自在にできるようになります。
これも応用次第で色々使えますね!
以上です。

