↑↑のような枠線の作り方
アメブロやリザストイベント、リザストメルマガで使うことができる枠線について
【アメブロ編】【リザスト イベント編】【リザストメルマガ編】
作り方は最後にあります
最後までみてくださいませ～
まずはこんなデザインいかがでしょうか。
<div class="l-border l-p-t l-p-r l-p-b l-p-l" style="margin:15px 5px;padding:10px;color:#333333;background:#ffe0f0;box-shadow:0 0 0 5px #ffe0f0;border:dashed 2px #ffffff;"><span style="color:#ff007d;">■</span></div>
<div class="l-border l-p-t l-p-r l-p-b l-p-l" style="margin:15px 5px;padding:10px;color:#333333;background:#F7FE2E;box-shadow:0 0 0 5px #F7FE2E;border:dashed 2px #ffffff;"><span style="color:#ff007d;">■</span></div>
<div class="l-border l-p-t l-p-r l-p-b l-p-l" style="margin:15px 5px;padding:10px;color:#333333;background:#a0965a;box-shadow:0 0 0 5px #a0965a;border:dashed 2px #ffc0cb;"><span style="color:#ffbfbf;">■</span></div>
<div style="border-bottom: 2px solid #ffa3d1; padding-left: 10px; font-weight: bold; font-size: 100%; color: #000000;">ピンクの下線</div>
<div style="border-bottom: 2px solid #191970; border-top: 2px solid #191970; padding-left: 10px; font-weight: bold; font-size: 100%; color: #000000;">青の下線</div>
<div style="border-bottom: 2px solid #ffa3d1; border-top: 2px solid #ffa3d1; padding-left: 10px; font-weight: bold; font-size: 100%; color: #000000;">ピンクの下線</div>
<div style="border: 1px dashed #000000; padding: 15px;">枠線の作り方１</div>
<div style="border: 1px dashed #f4a460; padding: 15px;">枠線の作り方２</div>
<div style="border: 1px dashed #0000ff; padding: 15px;">枠線の作り方３</div>
<div style="border: 1px dashed #fd5dac; padding: 15px;">ピンクの枠線</div>
<div style=" background:#000000; padding: 15px;"><span style="color: rgb(0, 190, 255);">枠線の作り方１</span></div>
<div style=" background:#ffcccc; padding: 15px;"><span style="color: rgb(0, 190, 255);">枠線の作り方2</span></div>
<div style=" background:#ff9933; padding: 15px;"><span style="color: rgb(0, 190, 255);">枠線の作り方3</span></div>
<div style="border: 1px solid #ffc0cb; padding: 15px;">枠線実践１</div>
<div style="border: 1px solid #afeeee; padding: 15px;">枠線実践２</div>
<div style="border: 1px solid #dda0dd; padding: 15px;">枠線実践３</div>
<div style="padding:10px; border:1px solid #4e80ff; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; box-shadow: 5px 5px 5px #ccc;">影付き枠線１</div>
ここにタイトルを入れます。1本文
ここにタイトルを入れます。2本文
ここにタイトルを入れます。3本文
<div style="background:#a0522d; border:1px solid #a0522d; padding-left:10px;"><font style="color:#ffffff; font-weight:bold;"><img src="http://stat100.ameba.jp/blog/ucs/img/char/char2/031.gif" style="line-height: 1.5;"> ここにタイトルを入れます。3</font></div><div style="border:1px solid #a0522d; padding:10px;">見出し付き囲み線 3<br>
<div style="padding: 0px 0px 1px 5px; font-size: 1.2em; font-weight: bold; border-bottom-color: rgb(0, 0, 102); border-left-color: rgb(0, 0, 102); border-bottom-width: 2px; border-left-width: 8px; border-bottom-style: solid; border-left-style: solid;">この記事も参考にして！</div><br><br><br><div style="padding: 0px 0px 1px 5px; font-weight: bold; border-bottom-color: rgb(255, 0, 153); border-left-color: rgb(255, 0, 153); border-bottom-width: 2px; border-left-width: 8px; border-bottom-style: solid; border-left-style: solid;"><span style="font-size: 18px;">この記事も参考にして！ピンク</span></div>
<div style="padding: 0px 0px 1px 5px; font-weight: bold; border-bottom-color: rgb(255, 204, 153); border-left-color: rgb(255, 204, 153); border-bottom-width: 2px; border-left-width: 8px; border-bottom-style: solid; border-left-style: solid;"><span style="font-size: 18px;">この記事も参考にして！金</span></div>
作成方法【アメブロ編】
①HTML表示
②ソースを入れる
③通常表示
④出来上がり
【リザスト イベント編】
①イベント→イベント案内の編集
②ツール
③コードを入れる
④OK
【リザストメルマガ編】
①メルマガ編①メルマガ記事作成
②写真付HTMLメール
③ツール
④ソースコード
⑤コードを貼り付ける
⑥OK
アメブロ枠線 リザスト枠線 お洒落な画像付枠線はこちらから
ブログを可愛く作ってください。
操作はこちらから
https://ameblo.jp/sensemiriza/entry-12334555072.html
女性起業家に必要なパソコンスキルなどを
メール講座でご案内しています。↓↓
リザーブストック全体設定マニュアル
リザーブストック個別予約管理
リザーブストックイベント/グループレッスン管理
リザーブストックメルマガ/ステップメール/ファーストアンサー 
リザーブストックショップ/契約商品 
リザーブストック汎用フォーム
↑↑↑ マニュアルページはスマホで見ながらパソコンで操作してください！！
ブログがサクサク書けるLINE講座
line追加後 スタンプを、おしてください
リザスト有料版をする場合は こちら
毎月開催のイベントに来てくださった受講生さん
同じイベントに来てくださった受講生さん
同じ興味を持っている見込み客
😊
‼️】
❤️
😱
