アメブロの記事で使える

『横ラインの見出し&枠線』を紹介します。

 

 

見出しの使い方や色の変更方法などは

こちらの記事で説明しています看板持ち

右囲み枠をアメブロ記事に設定する方法

右​枠線や囲み枠の線の形・太さ・色を変える方法

 

 

見出し&枠線は他にもたくさんあります飛び出すハート

右アメブロで使える♡枠線線&アンダーライン一覧

 

 

見出しを変更する場合は

最初と最後の「p」を

● 大見出しは「h2」

● 中見出しは「h3」

● 小見出しは「h4」に変更

 

 

ステッチ風(白)の見出し&枠線

 

 

アメブロ基本カラー11色気づき

 

 

①マゼンタ

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #FF007D; box-shadow: #FF007D 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

②ベビーピンク

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #FFBFDE; box-shadow: #FFBFDE 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

③ピンク

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #FF7FBE; box-shadow: #FF7FBE 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

④コーラル

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #FF7F7F; box-shadow: #FF7F7F 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑤フラミンゴピンク

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #FFBFBF; box-shadow: #FFBFBF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑥ブルーパープル

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #7F7FFF; box-shadow: #7F7FFF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑦ロイヤルブルー

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #0000BF; box-shadow: #0000BF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑧オーキッド

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #E3C7FF; box-shadow: #E3C7FF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑨アメジスト

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #C78FFF; box-shadow: #C78FFF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑩アイスブルー

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #BFEBFF; box-shadow: #BFEBFF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

⑪グレー

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #BFBFBF; box-shadow: #BFBFBF 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

 

 

大人可愛いカラー10色気づき

 
 

ティファニーブルー

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #B9EBE6; box-shadow: #B9EBE6 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

アンバーローズ

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #E0B6B6; box-shadow: #E0B6B6 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

くすみピンク

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #E3D3D3; box-shadow: #E3D3D3 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

くすみパープル

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #D1CAD8; box-shadow: #D1CAD8 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

オールドローズ

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #BD8A9A; box-shadow: #BD8A9A 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

くすみブルー

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #AFBED4; box-shadow: #AFBED4 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

くすみグリーン

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #CED9CE; box-shadow: #CED9CE 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

くすみグレー

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #CFD7DC; box-shadow: #CFD7DC 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

ライトベージュ

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #EBE7E4; box-shadow: #EBE7E4 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

グレージュ

ここに見出し

 

<p style="border: dashed 3px #FFFFFF ; background: #D7CEC9; box-shadow: #D7CEC9 0px 0px 0px 10px; padding: 8px;"><span style="color:#ffffff; font-weight:bold;">ここに見出し</span></p>
<p>&nbsp;</p>

 

 

 
 

 

他の種類の枠線はコチラ

右他の見出し一覧はこちら♡

 

 

右アメブロカスタマイズリンク集

右アメブロで使える♡おしゃれな囲み枠まとめ

 

 


 

 

もしこの記事があなたの参考になったら
ぜひいいね&フォローをお願いします

 

 

今日もあなたにとって素敵な1日となりますように星

 

 

 

 

 

 

ジュジュちゃん

ジュジュちゃん
 

なんだか上手にできない!などありましたら遠慮なくコメントに残してくださいね♬

 

 

 

 

 

\LINE公式リニューアル♡/
SNSで世界観をつくる8つのプレゼント

↓  ↓  ↓  ↓  ↓

 

LINE公式

 

LINE公式登録でSNSの世界観をつくる8大プレゼント

 

画像をクリックして登録♡
LINE画面が表示されない方は
@joujounetでID検索
(@も含めて検索してください)

 

 

 

 

Service

 

アメブロカスタマイズ/ライティング添削
ヘッダー/バナー/HP制作/インスタテンプレ作成
Instagramコンサル/Canva/LINEリッチメニュー
デュプロマ・テキスト・講座資料の作成
Lステップ代行構築/LINE運用アドバイス

 

SNSマーケティングをもとに幅広く
女性に響くデザインで
あなたらしさを叶えます♡

 

ハンドメイドやエステサロン
カフェ&レストラン・英語教室
アロマ・ネイル・婚活塾など

全国各地からご依頼・コンサルで一人一人
寄り添ったサポートを心がけています♡

 

 

 

 

 

 

\3人のママでも理想の働き方を手に入れた方法✨/

ただの主婦がWebデザイナーになった理由

 

\インスタはこちら♡Follow Me✨/

思わず二度見され心を奪うデザインで世界観をつくるInstagramはこちら

 

LINE公式マーケティングやデザイン作りのヒントを発信♡

視線を集め心を奪う世界観のつくりかたホームページ/ジュジュネット

 

心ときめく食器とお花が作れるポーセラーツ&フラワーインテリア
JouJouetteの教室ブログはこちら♡

ポーセラーツ・フラワーインテリア教室ジュジュエッテのブログはこちら


Thank you for Reading

JOUJOUNET ダイヤモンドジュジュネット

▶︎お問合せ(LINE@ID → @joujounet )
▶︎Instagram  ▶︎Facebook  ▶︎HP