コピペでCSS！は、「深い意味まで考えず、CSSコードを自分仕様にアレンジして使おうぜ！」という内容です。直観的に使いたい！簡単が1番！そんな方におススメです。
お好きな色やサイズに変更し、必要があればクラス名も変えてご使用ください。
コードはどこに書くの？という方、うまく反映されないなぁという方は、以下をどうぞ。
 |
どういうもののこと？ |
|---|---|
 |
どんな時に発生しているのか、 |
相変わらず浅く解説しておりますので、よければ参考にしてください。
便利な囲み枠2
差が出る！
見やすくなる囲み枠たち
当サイトが実際に使用している囲み枠（box線）です。
派手なデザインは控え、あくまでもテキストを補う程度のシンプルで実用的なものを掲載しています。
ところかまわず使うと読み辛くなるので、構成に気を配ってお役立てください。
～.cssに記述するためのコードを掲載しているので、「投稿」への記述は下記を参考にしてください。
style.cssにコピペして…
.aokagi1 { 以下省略
「投稿」へ書くと…（HTML）
<div class=”haikagi1″>こんな感じで「投稿」へ入力>してください</div>
以下のようにWebサイトで表示されます
▼ Bigカギカッコ
▼ Bigカッコ
不定期で気ままに…
※こちらはテキストにもデザインを適用させています。
投稿文入力時（HTML）はテキストにもclass指定してください。
ひとまず全てをstyle.cssにコピペして…
.redkakko { ～以下省略
「投稿」（HTML）には以下のように記述します。
<div class=”redkakko“><p class=”subtex”>不定期で気ままに…</p></div>
▼ 付箋風（ドッグイヤー風）
※こちらは付箋を中央寄せしたデザインとなります。
以上です。
ここでワンポイント！
囲み枠を横幅いっぱいに広げたい時は、コピペするコード内にあるdisplay:inline-block;を削除してください。
囲み枠の外周の余白を変更したい時は、コピペするコードのmargin:○% ○%;にある数値を変更します。
この部分が上下・左右の余白幅になるので、お好きな数値でバランスをみてください。
色や太さが違うだけで大きく変わる囲み枠。
いろいろ試して、よりサイトに似合う線種を見つけてくださいね！
次回は空白も作れるヘビロテ間違いナシの段落や改行をご紹介します。
コピペで
囲み枠1
コピペで
段落
ご覧いただきありがとうございました！
