サイトのstyle.cssに下記のソースを貼り付ける。
ワードプレスの管理画面を開き、「外観」から「テーマの編集」を開く。
そこでstyle.cssが開かれていることを確認し、以下のコードをそのまま貼り付けて内容を保存。
POINT
/************************************
** 記事内の文章を枠で囲むCSS
************************************/
.waku {
width: 90%;
margin: 16px auto;
padding: 14px 12px ;
line-height: 1.5;
position: relative;
border: 3px solid #FF81A0;
border-radius: 5px;
box-shadow: 0 5px 3px -3px rgba(0,0,0,0.4);
}
.waku span {
padding-right: 5px;
}
.attention {
font-size: 16px;
color: #000;
text-align: center;
line-height: 1;
position: absolute;
top: -.8em;
left: 30px;
background: #fff;
padding: 5px 10px;
}
POINT
<div class=”waku”>
<div class=”attention”>
POINT
</div>
ここに本文をいれる
</div>
以上