FC2ブログ

Welcome to my blog

スポンサー広告

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ブログランキング参加中

見たらクリックしてもらえると、とっても嬉しいです!!
HTMLとかのWeb関連

htmlでいい感じの枠をつける

0
こんにちわ!しゅんごんです。

あれでいかにも賢そうな人のブログになるんですが…。
地味にドットで囲まれた枠を使っているのを忘れておりました。

というのは、実際にソースコードを前の記事の通りに貼るとこんな感じになるんです。

keyakizaka 46
osimen ha Hirate Yurina
Techi daisuki

ですが、僕はブログ

keyakizaka 46
osimen ha Hirate Yurina
Techi daisuki

な感じで枠をつけています。

しれっと前回の記事で使ってましたが、この手の枠を使いたいときは毎回調べています。
コピペするだけで使うことができるサイトが調べるとあるんですよね〜。
例えばこうゆうページとか参考にしています。

んで、僕がソースコードを記事に書くときに使っているシンプルなドットの枠は、

<div style="padding: 10px; margin-bottom: 10px; border: 1px dotted #333333;">ここに枠の中身を書く</div>

いやぁ正直意味分かんないっす!!!
僕自身、ブログにメモ書き程度にソーズコードやコマンドを貼りたいだけなので、流石にstyleの定義までは確認していません。
とりあえず<div>のスタイルで枠を定義しているんだろうなぁと思ってはいます。

ちなみに、僕が同人誌紹介ブログ(成年向けだよ〜)で使っている枠は

これです!!!
同人誌即売会などのイベント紹介記事とかで一部使っています。
シンプルなのでブログのデザインを変えても馴染みますし、角が丸いのも気に入っています。

この枠は

<div style="border:1px solid #CCC;padding:10px;border-radius:10px;">ここに枠の中身を書く</div>

とするとできます。
他にもいろいろな枠のデザインがググれば出てくると思います。
自分のお気に入りの枠を見つけてみてください!!!

参考サイト

ブログランキング参加中

見たらクリックしてもらえると、とっても嬉しいです!!
htmlブログ

- 0 Comments

There are no comments yet.

Leave a reply

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。