シェアする

  • このエントリーをはてなブックマークに追加

HTMLタグ、CSSを使って、簡単に記事中の文章を枠線で囲むカスタマイズ方法!

シェアする

  • このエントリーをはてなブックマークに追加
  • 18
frame-border-surround-00-web


どうも、ジョニー@creatorcheck)です。

当ブログで使用している「枠線」のカスタマイズ方法のご紹介です。

この枠線のことですよ。

使用するHTMLタグ

<div style="padding: 20px; border: solid 2px #73907b; border-radius: 10px; background-color: #f3f3f3; margin-top: 30px; margin-bottom: 30px;">ここに文字を入力します。</div>
  • padding … 枠と文章の余白。
  • border … 枠線の種類、太さ、色。
  • border-radius … 角丸の半径。
  • background-color … 背景色。
  • margin-top・margin-bottom … 枠の上下の余白。
色々いじってみてね!johnny-c

まとめ(感想)

とっても簡単に枠線で囲めましたね。ちょっとしたことでサイトの見栄えって変わりますからね〜難しいです。

johnny-tubuyaki

あなたも私も独学.. いいじゃないの〜。
HTMLタグ、CSSを使って、簡単に記事中の文章を枠線で囲むカスタマイズ方法!
この記事をお届けした
クリエイターチェックの最新ニュース情報を、
いいねしてチェックしよう!
スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク