【Amebaアプリ】左寄せの見出し枠 一覧

おしゃれなもの、かわいいものもあって

いろいろ使えそうな気がしまして、

Amebaアプリで作れる

HTMLタグをまとめてみました。

「子育ても仕事も、私らしく軽やかに」

起業準備中から起業1年目の女性に
プロフェッショナルへの
"はじめの一歩”を後押し！

女性起業家の“オンライン黒子”

起業スタートアップサポーター
魅力引き出しフォトグラファー
高木美香です。

Amabaアプリで見出し枠が簡単に入力できるようになった

↑こういう枠線、PCで一生懸命がんばる方も

多いと思うのですが、

最近、Amebaアプリでも

簡単に作れるようになってきたんですよね。

種類がた～くさん！

「これ、PCでも作業したいな」…なので、HTMLタグをまとめてみた。

私はブログをPCで作業したい派で

スマホのAmebaアプリはブログ記事になりそうなことを

メモ書きする程度にしか使用していません。

なので、Amebaアプリで

見出し枠をつけたり

装飾したりなど

全体の体裁を整えていくのが

実は苦手です。

でも、Amebaアプリで作れる

見出し枠が結構おしゃれなので

これらをPCで作業できたら楽しいかも。

↓

もしかしたら、必要な方が他にもいるかも。

と思ったので、

Amebaアプリの見出し枠HTMLタグ、

まとめてみることにしました。

中央寄せはこちらの記事を参照してください。

左寄せ見出し枠　一覧

①斜め線　ライトグリーン＆グレー
 

 （ここを変更する）

<h2 class="cool05_heading" data-entrydesign-alignment="left" data-entrydesign-part="cool05_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="display:flex;line-height:1.4;font-weight:bold;font-size:20px;min-height:28px;color:#494B41;margin:8px 0;line-break:anywhere"><span class="amp-nodisplay" contenteditable="false" role="presentation" style="display:block;flex-shrink:0;width:4px;height:28px;margin-right:14px;transform:skew(-30deg);border-left:4px solid #CBF64C;border-right:4px solid #8F908B">&nbsp;</span><span style="flex-grow:1;display:block;text-align:left"><span data-entrydesign-content="" style="display:inline-block">（ここを変更する）</span></span></h2>

②黒太下線　青ドット

  （ここを変更する）

<h2 class="cool04_heading" data-entrydesign-alignment="left" data-entrydesign-part="cool04_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="display:flex;flex-direction:column-reverse;margin:8px 0;align-items:flex-start"><span class="amp-nodisplay" contenteditable="false" role="presentation" style="display:flex;align-items:center;margin-top:14px"><span style="display:inline-block;margin-right:4px;width:84px;height:4px;border-radius:4px;background-color:#28272B">&nbsp;</span><span style="display:inline-block;width:6px;height:6px;border-radius:6px;background-color:#1454CF">&nbsp;</span></span><span data-entrydesign-content="" style="display:inline-block;color:#111119;font-weight:bold;font-size:20px;line-height:1.4;min-height:28px;line-break:anywhere">（ここを変更する）</span></h2>

③オレンジ文字

③（ここを変更する）

<h3 class="limited013_heading" data-entrydesign-alignment="left" data-entrydesign-part="limited013_heading" data-entrydesign-tag="h3" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="margin:8px 0;font-weight:bold;color:#E97408;letter-spacing:0.01em;font-size:16px;line-height:1.4;min-height:28px;line-break:loose;word-break:break-word;position:relative;padding-left:20px"><span data-entrydesign-content="" style="display:inline-block">③（ここを変更する）</span></h3>

④下線　黒&グレー

 （ここを変更する）

<h2 class="cool07_heading" data-entrydesign-alignment="left" data-entrydesign-part="cool07_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="display:flex;flex-direction:column-reverse;margin:8px 0;align-items:flex-start"><span class="amp-nodisplay" contenteditable="false" role="presentation" style="display:block;box-sizing:border-box;margin-top:16px;width:52px;height:4px;background-color:#929292;border-left:12px solid #2E2E2E">&nbsp;</span><span data-entrydesign-content="" style="display:inline-block;font-weight:bold;color:#2E2E2E;font-size:20px;letter-spacing:0.01em;line-height:1.4;min-height:28px;line-break:anywhere">④（ここを変更する）</span></h2>

⑤水色さんかく

（ここを変更する）

<h3 class="limited202104bestBuy_heading02" data-entrydesign-alignment="left" data-entrydesign-part="limited202104bestBuy_heading02" data-entrydesign-tag="h3" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="display:flex;color:#3174A7;font-weight:bold;font-size:16px;line-height:1.4;min-height:28px;line-break:loose;word-break:break-word;align-items:center;margin:4px 0 12px"><span class="amp-nodisplay" contenteditable="false" role="presentation" style="display:inline-flex;box-sizing:border-box;flex-shrink:0;margin-right:8px;margin-left:4px;width:12px;height:14px"><img alt="" contenteditable="false" data-amb-layout="intrinsic" data-entrydesign-image="true" height="14" src="https://stat100.ameba.jp/ameblo/entry_designs/v1/sources/assets/limited202104bestBuy_heading02_triangle.png" style="max-width:100%;-o-object-fit:cover;object-fit:cover" width="12"></span><span style="flex-grow:1;display:block;text-align:left"><span data-entrydesign-content="" style="display:inline-block">（ここを変更する）</span></span></h3>
 

⑥青タテ線

 （ここを変更する）

<h2 class="wa10_heading" data-entrydesign-alignment="left" data-entrydesign-part="wa10_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="display:flex;line-height:1.4;font-weight:bold;font-size:20px;min-height:28px;color:#2C486E;margin:8px 0;line-break:anywhere"><span class="amp-nodisplay" contenteditable="false" role="presentation" style="display:block;box-sizing:border-box;flex-shrink:0;width:12px;background-color:transparent;margin-right:8px;border-left:8px solid #2C486E;border-right:2px solid #2C486E">&nbsp;</span><span style="display:block;flex-grow:1;text-align:left">（ここを変更する）</span></h2>

⑦グレータテ線

 （ここを変更する）

<h2 class="simple09_heading" data-entrydesign-alignment="left" data-entrydesign-part="simple09_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="display:flex;line-height:1.4;font-weight:bold;font-size:20px;min-height:28px;color:#333;margin:8px 0;line-break:anywhere"><span class="amp-nodisplay" contenteditable="false" role="presentation" style="display:block;flex-shrink:0;width:4px;background-color:rgba(8, 18, 26, 0.16);border-radius:4px;margin-right:8px">&nbsp;</span><span style="flex-grow:1;display:block;text-align:left"><span data-entrydesign-content="" style="display:inline-block">（ここを変更する）</span></span></h2>

⑧グレー　タテ線＆細め下線

（ここを変更する）

<h2 class="cool10_heading" data-entrydesign-alignment="left" data-entrydesign-part="cool10_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="color:#323232;font-size:20px;line-height:1.4;min-height:28px;line-break:anywhere;padding:12px 16px;margin:8px 0;border-bottom:1px solid #898989;border-left:4px solid #898989;text-align:left"><span data-entrydesign-content="" style="display:inline-block">（ここを変更する）</span></h2>

⑨下線　薄いグレー

（ここを変更する）

<h2 class="cool09_heading" data-entrydesign-alignment="left" data-entrydesign-part="cool09_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="color:#2B2741;font-weight:normal;font-size:20px;line-height:1.4;min-height:28px;line-break:anywhere;padding-bottom:16px;border-bottom:2px solid #CECBD8;margin:8px 0;text-align:left"><span data-entrydesign-content="" style="display:inline-block">（ここを変更する）</span></h2>

⑩下線　薄いベージュ

（ここを変更する）

<h2 class="cool08_heading" data-entrydesign-alignment="left" data-entrydesign-part="cool08_heading" data-entrydesign-tag="h2" data-entrydesign-type="heading" data-entrydesign-ver="1.8.0" style="color:#4F5153;font-weight:bold;padding-bottom:14px;border-bottom:2px solid #F0EDE7;margin:8px 0;font-size:20px;line-height:1.4;min-height:28px;line-break:anywhere;text-align:left">（ここを変更する）</h2>

参考になればうれしいです

◆LINEアカウント開設のお知らせ
高木美香のLINE公式アカウントができました！
起業準備中から起業1年目の女性にむけて
スタートアップ支援サービスや
プロフィール撮影会のお知らせなど
先行してご案内いたします。
https://lin.ee/SNr9VgZ


◆高木が直接運営するFBグループ
「ぷちクリエイティ部」

脱インプット馬鹿！がコンセプト
どんな些細なアイディアも
"本気で形にする"女性限定のオンライン部活です。

その想像・空想、一緒に創造に変えませんか？

ここまでお読みいただきありがとうございました。