アメケアに入れておきたい囲み枠のタグ一覧

自分だけの魅力を引き出し売り出す！
自分ブランド構築コンサルタントの住福です。

アメケアとはアメブロカスタムの松本さんが作られた、アメブロ便利ツールなのですが、そのツールを使って囲み枠を入れると、誰でも簡単に囲み枠を入れられるようになりますよ(^^)/

※アメケアのダウンロードはコチラ
↑クロームブラウザのみ対応しています。

※アメケアの導入方法・便利機能紹介はコチラ

この記事ではアメケアに入れておきたいタグ一覧をご紹介します。

HTMLのタグをコピーし、
アメケア設定 → 囲み枠 → 新規囲み枠の登録からご登録ください。

やり方を動画で紹介しています。
この動画のさらに下にタグの一覧がありますのでコピペして使用ください。

※ ちなみに初の動画撮影ということで、緊張しているのかめちゃ噛み噛みです(笑)

※ なぜかマウスのポインタが変なところにいってしまい、少し分かりにくいかもしれません。ソフトの機能の問題でしょうか。。。ご容赦ください。

⇒ アメケアの導入はコチラの記事を参考にして下さい。

影付き囲み枠のタグ

影付き囲み枠　ピンク
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #ff0000; border-radius: 5px; box-shadow: 3px 3px 4px #fcc1f9;">%TEXT% </div>

プレビュー

影付き囲み枠　オレンジ
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #FFA500; border-radius: 5px; box-shadow: 3px 3px 4px #FF6600;">%TEXT% </div>

プレビュー

影付き囲み枠　ゴールド
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #DAA520; border-radius: 5px; box-shadow: 3px 3px 4px #BDB76B;">%TEXT% </div>

プレビュー

影付き囲み枠　青
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #003399; border-radius: 5px; box-shadow: 3px 3px 4px #000044;">%TEXT% </div>

プレビュー

影付き囲み枠　赤
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #FF3300; border-radius: 5px; box-shadow: 3px 3px 4px #8B0000;">%TEXT% </div>

プレビュー

影付き囲み枠　紫
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #9966CC; border-radius: 5px; box-shadow: 3px 3px 4px #4B0082;">%TEXT% </div>

プレビュー

影付き囲み枠　緑
<div style="position: relative; word-break: break-all; color: #333333; f font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #006600; border-radius: 5px; box-shadow: 3px 3px 4px #003300;">%TEXT% </div>

プレビュー

影付き囲み枠　黒
<div style="position: relative; word-break: break-all; color: #333333; font-weight: normal; text-decoration: none; background: #FFFFFF; margin: 5px 5px; padding: 10px 10px; border-width: 1px; border-style: solid; border-color: #333333; border-radius: 5px; box-shadow: 3px 3px 4px #AAAAAA;">%TEXT% </div>

プレビュー

シンプルな囲み枠のタグ

シンプル囲み枠（ピンク）
<div style="border:2px dotted #FF1493; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（オレンジ）
<div style="border:2px dotted #FFA500; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（ゴールド）
<div style="border:2px dotted #DAA520; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（青）
<div style="border:2px dotted #003399; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（赤）
<div style="border:2px dotted #FF3300; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（紫）
<div style="border:2px dotted #9966CC; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（緑）
<div style="border:2px dotted #006600; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（黒）
<div style="border:2px dotted #333333; padding:10px;">%TEXT%</div>

プレビュー

シンプル囲み枠（グレー）
<div style="border:2px dotted #666666; padding:10px;">%TEXT%</div>

プレビュー

見出し付き囲み枠のタグ

見出し付き囲み枠　ピンク
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#FF99CC; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #FF99CC; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　オレンジ
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#FFA500; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #FFA500; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　ゴールド
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#DAA520; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #DAA520; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　青
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#003399; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #003399; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　赤
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#FF3300; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #FF3300; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　紫
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#9966CC; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #9966CC; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　緑
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#006600; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #006600; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出し付き囲み枠　黒
<div style="height:12px;"><span style="margin-left:8px; padding:6px 10px; background:#333333; color:#ffffff; font-weight:bold;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;"><font size="3">タイトル</font></span></div><div style="border:2px solid #333333; padding:25px 12px 10px; font-size:1em;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">%TEXT%</div>

タイトル

プレビュー

見出しのタグ

見出し　ピンク
<div style="border-left:10px solid #FF99CC; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　オレンジ
<div style="border-left:10px solid #FFA500; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　ゴールド
<div style="border-left:10px solid #DAA520; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　青
<div style="border-left:10px solid #003399; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　赤
<div style="border-left:10px solid #FF3300; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　紫
<div style="border-left:10px solid #9966CC; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　緑
<div style="border-left:10px solid #006600; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

見出し　黒
<div style="border-left:10px solid #333333; border-bottom:3px solid #333333; padding-left:10px; font-weight:bold;"><font size="5"> %TEXT%</font></div>

プレビュー

その他の使えるタグ

小見出し
<div style="border-bottom: 1px solid #696969; padding-left: 10px; font-weight: bold;">%TEXT%</div>

プレビュー

センタリング
<div align="center">%TEXT%</div>

プレビュー

赤字太字
<strong><font color="#FF0000">%TEXT% </font></strong>

プレビュー

以上です。
ありがとうございます＾＾

自分ブランドでビジネスを加速！

⇒ 募集中のセミナー情報はコチラ

【重要なお知らせ】

■集客力がつく、無料のメール講座にご登録下さい♪
とあるサロンオーナーが自分ブランドを作り、集客と売上を変えていくお話です＾＾

ご登録はコチラから

アメブロ初心者さんはコチラ！
「販売力のあるブログの作り方」をお伝えしています。

↑ バナークリックでご登録 ↑

Next Innovation　住福純

ホームページ / アメブロカスタム / 継続コンサルティング / お問合せ

私は福岡だけでなく、北九州、久留米、熊本、長崎、佐賀、鹿児島、大分、宮崎などの九州各地から、東京、大阪、名古屋、北海道、海外まで多方面でコンサルを行っています。

ブログ集客、メルマガ集客、セミナー集客、Facebook集客、LINE＠集客、インスタグラム集客、動画集客、YouTube集客、チラシ集客、ホットペッパー集客、手紙集客、雑誌集客、WordPress、リザーブストックなど幅広いコンサルスキルであなたのブランディング、売り出しを徹底サポート致します。