こんにちは、SEO対策「賢威」専用 素材屋さん 中の人、『菊地』です。
今回の記事では、賢威7.0でデフォルトで用意されているCSSをまとめてご紹介したいと思います。
賢威7.0の便利なCSS
装飾編※IE8等古いブラウザを除く
クラス名に「shadow」を追加することで、影１を付けることができます。
クラス名に「shadow02」を追加することで、影２を付けることができます。
クラス名に「outline」を追加することで、エリアにアウトラインを付けることができます。
クラス名に「frame」を追加することで、エリアにフレームを付けることができます。
クラス名に「border」を追加することで、エリアに枠線を付けることができます。
円と角丸編
画像又はエリアのクラス名に何も追加しない場合
クラス名に「circle」を追加することで、エリア、又は画像などを正円にすることができます。
クラス名に「rc4」を追加することで、エリア、又は画像などの四隅を4px分、丸くすることができます。
クラス名に「rc8」を追加することで、エリア、又は画像などの四隅を8px分、丸くすることができます。
クラス名に「rc12」を追加することで、エリア、又は画像などの四隅を12px分、丸くすることができます。
クラス名に「rc4-tl,rc8-tr,rc12-bl」を追加することで、四隅でそれぞれ別の数値での角丸にすることが可能です。
文字色
クラス名に「red」を追加することで、文字色が赤になります。
クラス名に「blue」を追加することで、文字色が青になります。
クラス名に「green」を追加することで、文字色が緑になります。
クラス名に「yellow」を追加することで、文字色が黄色になります。
クラス名に「orange」を追加することで、文字色がオレンジになります。
クラス名に「pink」を追加することで、文字色がピンクになります。
クラス名に「purple」を追加することで、文字色が紫になります。
クラス名に「olive」を追加することで、文字色がオリーブ色になります。
クラス名に「lime」を追加することで、文字色がライム色になります。
クラス名に「aqua」を追加することで、文字色が水色になります。
クラス名に「brown」を追加することで、文字色が茶色になります。
クラス名に「gray」を追加することで、文字色が灰色になります。
クラス名に「black」を追加することで、文字色が黒になります。
クラス名に「white」を追加することで、文字色が白になります。
※文字色が白の場合、見えないので背景色で「box-gray」のクラス名を追加しています。
マーカー表示
文字にオレンジ色の背景色をつけることができます。
文字にピンク色の背景色をつけることができます。
文字に黄色の背景色をつけることができます。
文字にライム色の背景色をつけることができます。
文文字に灰色の背景色をつけることができます。
このように賢威7.0には多様なCSS設定が準備されています。
是非一度、お試し頂ければと思います。
制作担当 菊地 浩貴
