Iconの編集方法

Color

背景の色を設定できます。

Background type

Imageを選択すると、要素の背景を画像にできます。

Gradientを選択すると、要素の背景をグラデーションにできます。

Attachmentを「Fixed」にすると、背景がスクロール量に応じて、変わります。

Spacing

Paddingは要素の内側のスペースのことです。

Marginは要素の外側のスペースのことです。

単位はPX、EM、REM、％から選ぶことができます。

赤枠のリンクマークをチェックすると、上下左右の数値を同じにできます。

チェックを外すと、バラバラに設定できます。

Border type

ボーダーの種類を選ぶことができます。

• None
• Solid　(一本線)
• Dashed　(破線)
• Dotted　(ドット)
• Double　(二重線)
• Groove　(立体的に窪んだ線)
• Ridge　(立体的に隆起した線)
• Inset　(上と左のボーダーが暗く、下と右のボーダーが明るい線)
• Outset　(上と左のボーダーが明るく、下と右のボーダーが暗い線)
• Hidden

Border　(Border type：none以外)

Border typeをnone以外に設定すると表示されます。

上下左右のボーダーの太さを設定できます。

Color　(Border type：none以外)

Border typeをnone以外に設定すると表示されます。

ボーダーの色を設定できます。

Border radius

ボーダーの角４点の丸みを調整できます。

上記のように設定すると、以下のようになります。

(TLはTOP LEFTつまり左上、BRはBOTTOM RIGHTつまり右下です)

Box shadow

有効化すると、要素に影を入れることができます。

鉛筆マークをクリックし、Customを選択すると、影を細かく調整できます。

鉛筆マークをクリックし、Presetを選択すると、すでに設定された影を表示できます。

Effect type

動きを設定できます。

設定できるエフェクト

None
Fading
　Fade In
　Fade In Up
　Fade In Down
　Fade In Left
　Fade In Right
Zooming
　Zoom In
　Zoom In Up
　Zoom In Down
　Zoom In Left
　Zoom In Right
Bouncing
　Bounce In
　Bounce In Up
　Bounce In Down
　Bounce In Left
　Bounce In Right
Sliding
　Slide In Up
　Slide In Down
　Slide In Left
　Slide In Right
Rotating
　Rotate In
　Rotate In Down Left
　Rotate In Down Right
　Rotate In Up Left
　Rotate In Up Right
Attention seekers
　Bounce
　Flash
　Pulse
　Rubber band
　Shake
　Swing
　Tada
　Wobble
　Jello
　Heart Beat
Light Speed
　Light Speed In
Specials
　Roll In
　Jack In The Box
Flippers
　Flip In X
　Flip In Y

Animation Duration

動きのスピートを調整できます。

1000にすると1秒かけて動きます。3000にすると3秒かけて動きます。数字が大きいほど、ゆっくり動くことになります。

Animation Delay

画面内に要素が出現した後、何秒後に動き始めるかを調整できます。

0にすると、出現後すぐに動きます。1000にすると1秒後に動きます。

Z Index

要素のZ方向の位置を設定できます。

「Zが0」「Zが1」の二つの要素がある場合、後者が前面に表示されます。

Overflow option

要素の高さや幅を固定している場合、文字や画像がその要素をはみ出た際に、はみ出た部分を表示するか、非表示にするかを設定できます。

Custom CSS ID

要素のタグにIDを設定できます。

Custom CSS classes

要素のタグにClassを設定できます。