LEGEND心に残る一品との出会いをお手伝いします。
A heaven in Pennsylvania.. #Nakashimawoodworkers https://t.co/RN6UQ2nX5f
ちょっと小さめだから、作り直すのかしら❓
PIROUETTE TWIRL ANGEL JUNG HOSEOK #BTSatMetLife_D2 #BTSxMETLIFE #BTSatMetLife https://t.co/w05wwvupeH
アングルバッチリ😆👍✨‼️
HOSEOK THE MAN YOU ARE TODAY @BTS_twt https://t.co/8U2o76UXIL
HOSEOK DIOR OUTFIT @BTS_twt https://t.co/g2pLqYIicd
ホソクさんの表情にヤラれる…😭💜✨
またディオールのお衣装似合い過ぎ😍💖
JHOPE IS MY NEW RELIGION#BTSatMetLife_D2 @BTS_twt https://t.co/NjzOdQOp56
マイドロ😆💜
HOSEOK MIC DROP @BTS_twt https://t.co/UHmuBG8Wod
JUNG HOSEOK DJDJJSKS @BTS_twt https://t.co/Mdgu5Zmkr7
MY GOD HAS BLESSED ME TODAY#BTSatMetLife_D2 #JHOPE #HOSEOK https://t.co/qqZK9atx2E
ユンギの次に上手😆👍🎵
Seeing him dance live??? WOW #BTSatMetLife_D2 #JHOPE #HOSEOK https://t.co/MNT7U8fn0p
He owns my whole entire heart #BTSatMetLife_D2 https://t.co/ejvnAySJUs
ホソクさん可愛い😍💕
My heart is literally about to burst #BTSatMetLife_D2 https://t.co/KQIruLEYEc
VHOPE AND TAEGI @BTS_twt https://t.co/0qNZT8ZfIB
jhope has one of the best stage presences ever 🔥 #BTSatMetLife_D2 https://t.co/mKXpLvgEel
YOONGI SPRAYED WATER ON US DURING IDOL #BLESSED#BTSatMetLife_D2 https://t.co/UubVI3awUU
Rip me #BTSatMetLife_D2 #BTSatMetlife https://t.co/LbfXzcs2pL
a wild yoongi #SUGA #슈가 #민윤기 #yoongi #BTS #방탄
년단 #speakyourselftour #btsxmetlife #BTSatMetLife #BTSatMetLife_D2 https://t.co/szdgFuF1g0
Yoongi twirl & boom💥 #BTSatMetLife_D2 https://t.co/29jCPAqQZg
Mic Drop 🎤 @BTS_twt #Yoongi #BTSatMetLife_D2 #SpeakYourselfTour https://t.co/AR4ybbCKFL
LEGEND#BTSatMetLife_D2 @BTS_twt https://t.co/IsYfdT3zYE
blurry but,, NAMGI NATION#BTSatMetlife #BTSxMetlife https://t.co/WC27vC4uL2
スクリーンではユンギさん切れてて🥺
NJ in NJ @BTS_twt #Namjoon #BTSatMetLife_D2 #SpeakYourselfTour https://t.co/yogvLVh0sB
namjooooooon #김남준 #남준 #Namjoon #RM #BTS #방탄소년단 #speakyourselftour #btsxmetlife #BTSatMetLife #BTSatMetLife_D2 https://t.co/b3jvwouNRF
コレは1日目のだけど。
Namjoon & Yoongi #BTsxMetlife https://t.co/chUY1rmNSH
NAMJOON SIR @BTS_twt https://t.co/YV8hN3RP9j
mandatory NAMJOON during Tear fancam,,,the headband,,,,i’d like to thank not only God but Jesus🥵🥵#BTSatMetLife… https://t.co/TcWyvC5TsD
ナムジュンも散髪したのね✨
受け入れてくれてありがとう。異なる見た目で異なる言語を話し、韓国語で歌う韓国から来た7人の少年を。皆さんが音楽は言語を超えるということを証明してくれました。ー190519 SYS NJ ナムジュン メント https://t.co/SeNk8aPjTw
最後の花火🎆🎇
🎆 소우주 깔리면서 불꽃놀이 너무 영화야.. My heart is full. I love you @BTS_twt#BTSatMetLife_D2 https://t.co/ONySKTFR1E
"輝く私の星座 いつも一緒にいるよ 永遠に"
[#오늘의방탄] Hello, New Jersey!SY US투어 마지막을 잘 마무리한 오늘! 아미가 웃으면 우리도 웃어요😊😘 #뉴저지2회차공연 https://t.co/ZUufLn64bq
カァッコいいん😍💖✨
いやしかし、肩幅の差よ😂
テッちゃんも☺️
ウチの人が『乗れ』って言ったとはいえ…
もうちょっと抑えめでお願いします…😓
楽っそーねアナタ…💧
ウチの人のこの表情…😅
近くで観れるだけでもラッキーなのに、
LEGENDをメイン商品として品揃えしております、センスが光る!こだわりの逸品をお得に♪
「なりたい自分」に、なれる女性を増やしたい!
ブランディングプロデューサーの櫻井圭子です。
本日はアメブロの記事の中で使える囲み枠線の作り方というお役立ち情報をお届けします!
コピペ対応のかわいい配色サンプル付きですよ!
スマホアプリで使う場合の説明&段々にならない改行の仕方も説明しています。
アメブロの記事の中での囲み枠線の使い方
①「ブログを書く」をクリック。
・新エディタの場合は、”HTML表示”にする。
・旧エディタの場合は、”タグ編集エディタ”にコピペしてください。
(旧エディタは2017年5月で廃止となりました。)
②下記のサンプルの中から好きな枠のサンプルを選んでコピペする。
③通常表示に戻して、本文を入力してください。
改行はShift+Enterで枠内で改行ができます。
(PCの機種によってはcommand+Enter)
※枠の下に入力カーソルが進めない場合
HTML表示画面で、枠のタグの下に<br>といれてください。
<br>・・・改行
コピペで使えるアメブロの囲み枠線のサンプル一覧
直線の囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background:#fff; padding:10px; border:2px solid #ffdbff;”>ここに本文を入力する。<br />改行はShift+Enter</div>
角丸の囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”padding: 10px; border: 2px solid #eddbff; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;”>ここに本文を入力する。<br />改行はShift+Enter</div>
点線の囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background:#fff; padding:10px; border:2px dashed #ffdbdb;”>ここに本文を入力する。<br />改行はShift+Enter</div>
水玉の囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background:#fff; padding:10px; border:3px dotted #ff0000;”>ここに本文を入力する。<br />改行はShift+Enter</div>
二重の囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background:#fff; padding:10px; border:3px double#99ffff;”>ここに本文を入力する。<br />改行はShift+Enter</div>
中が塗りつぶされてる四角い囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background:#ffd6ea; padding:10px; border:none;”>ここに本文を入力する。 <br />改行はShift+Enter</div>
中が塗りつぶされてる角丸の囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background: #ffeaff; padding: 10px; border: none; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;”>ここに本文を入力する。<br />改行はShift+Enter</div>
見出し付きの囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”background: #ff7fbf; border: 1px solid #ff7fbf; padding-left: 10px;”><span style=”color: #ffffff; font-weight: bold;”>■ここにタイトルを入力する</span></div><div style=”border: 1px solid #ff7fbf; padding: 10px;”>ここに本文を入力する。<br />改行はShift+Enter</div>
タイトルがはみ出てる直線の囲み枠線
■このタグをコピペする
<fieldset style=”border:2px solid #ff6699;”><legend><span style=”font-weight:bold;”>■ここにタイトルを入力する</span> </legend> ここに本文を入力する。<br />改行はShift+Enter</fieldset>
タイトルがはみ出てる二重の囲み枠線
■このタグをコピペする
<fieldset style=”border:3px double #ff6699;”><legend><span style=”font-weight:bold;”>■ここにタイトルを入力する</span> </legend>ここに本文を入力する。<br />改行はShift+Enter</fieldset>
シンプルな影付きの囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”border: 1px #dcdcdc solid; padding: 10px; box-shadow: 0 2px 3px 0 #ddd; background: #fff;”>ここに本文を入力する。<br>
改行はShift+Enter</div>
グラデーションと影付きで立体的な囲み枠線(角丸)
改行はShift+Enter
■このタグをコピペする
<div style=”background-image:linear-gradient(#ffd6ea,#ffe0ef,#ffeff7,#ffe0ef,#ffd6ea);background-color:#ffffff; padding:10px; width: auto;margin-right:6px; border-radius: 10px;border: 1px solid #ffcce5; box-shadow: 2px 2px 4px #dcdcdc;”>ここに本文を入力する。<br>
改行はShift+Enter</div>
※グラデーションと影はつけすぎるとダサくなってしまいますので、あくまでさりげなくがポイントです!
ポイント付きの付箋風オシャレ囲み枠線
改行はShift+Enter
■このタグをコピペする
<div style=”border: #ffb2d8 solid 1px; border-left: #ffb2d8 solid 13px; padding: 10px; background: #fffff9; “>
ここに本文を入力する。<br>
改行はShift+Enter</div>
スマホアプリで囲み枠線を使う方法を解説

ト!

囲み枠線のタグの解説
<div style=”background:#fff; padding:10px; border:2px solid #ffdbff;”>ここに本文を入力する。<br />改行はShift+Enter</div>
background:背景色
padding:枠と文字の間の隙間の幅
border:線の太さ、種類、色を指定
・線の種類
→solid…直線/double…二重線/dashed…破線/dotted…水玉線
#fff、#ffdbffなどは色になります。
色を変更したい場合は、こちらのサイトを参考にしてください。
原色大辞典
ポイント
”;”で閉じるのを忘れないようにしましょう。
タグは1文字でも消えてしまうときちんと表示されなくなってしまうので、気をつけてくださいね。
うまく表示されない場合はコメントにてお知らせください
というわけで、アメブロの記事の中で使える囲み枠線の作り方(コピペ対応かわいい配色サンプル付き)でした♪
コメント&シェア&メッセージはどうぞお気軽にしていただけると、とっても嬉しいです
\ブログで集客したい起業女子必見! /
ブログを24時間働く営業マンにするセミナー
自動集客の仕組みを理解してブログを24時間働く営業マンにしましょう!
プレミアムブログ集客プライベートレッスン
上質な空間で開催する、マンツーマン90分のブログ集客プライベートレッスン。
事前にヒアリングし、あなたにぴったりのレッスン内容に構成します。
さらに!嬉しいレッスン後2週間のメールフォロー付き!

LEGEND 関連ツイート
招待してほしい人またはこの人強いよって人いたらリプください
たぶんソロになります😃