スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
スポンサーサイト/--/--/-- --:--/スポンサー広告/ トラックバック(-)/コメント(-)

FC2Blog画像の枠

sumire3.jpg


とても苦労したんですが、。。。そう。一ヶ月、二ヶ月くらいです。
でも結局出来ない。
画像の枠をポラロイド風にしたいのですが。

どうも、プラウザがIEってことが駄目の原因と解りました。
エントリーの画像だけにスタイルシートで指定してもpaddingが反映されないのです。
BBSのスキンのように「IMG」が独立していればいいのですが、
テキストと一緒のなので、囲むと記事全部が囲われてしまう。。。

投稿時にスタイルを指定すると出来るのですが
テンプレートを替えた場合、ちょっと困ったりする。

そこで考えました。
っていううか「カスタマイズ・マニュアル」にそれらしいことは有るのですが、
前は出来なかったのです。

CSSの
entry_text img

適宜の名前にして。
それで投稿時に囲うのです。
すると、出来ました。ヾ(@~▽~@)ノわぁい
しかも、テンプレートを替えた場合は反映されません。
一応コレで対応します。
夏にはIEも新しくなるということで期待しています。
疲れました。

FC2Blog画像の枠/2005/05/18 07:33/[Blog]カスタマイズ/ トラックバック(0)/ comment(6)

comment

初めまして。
FC2ブログでこちらのテンプレートを見つけ使わせて頂こうと思っております。
それでカスタマイズについての質問なのですが、画像に黒枠を付けたいのですが、どのようにすればいいのか解りません。
後、画像と文字の間にスペースも入れたいのですが、ご助言頂ければ幸いです。
よろしくお願いします。

秋生 #4eg7mJls/2008/10/06(月) 00:29:19/URL[ 編集]

秋生さんへ

テンプレートは私のものでしょうか?
一般的な回答をするとすれば、先ず管理ページ、メニューの・テンプレートの設定 をクリック、適用しているテンプレートのHTML編集で
<%topentry_body>というタグを捜し、それを囲っているdiv class名・・・私のでしたらだいたい
<div class="entry_text">です。
中には
(<div class="entry_body">等の方もいますね。)

それを確認いたしましたら、
スタイルシート編集で
.entry_textまたは
div.entry_text {
・・・・
}
の下にある
.entry_text img
または
div.entry_text img
を編集します。
黒い枠をつけたいと言うことですので

div.entry_text img {
border : 5px solid #000;
}
としてみてください。線の太さは数字によります。
もしこの項目がない場合は書き足してみてください。いかがでしょうか?

具体的にどのテンプレートなのか解かればもう少し詳しくお知らせできると思います。

P.S

画像と文字の間にスペースですが
記事を投稿する時キーボードのEnterを押して改行し
そのページの一番下から4番目くらい

改行の扱い □自動改行  □HTMLタグのみ

と言うところの 自動改行にチェックを入れてください。
いかがでしょうか?



どりーみー #JalddpaA/2008/10/06(月) 07:29:16/URL[ 編集]

今日は。
素早い回答有難うございます。
テンプレート名を書き忘れたのですが、、FC2ブログの共有テンプレートからお借りしましたのは「dot_plugin」です。
夜にお教え頂きましたようにやってみます。
またご報告に参ります。

秋生 #4eg7mJls/2008/10/06(月) 15:21:00/URL[ 編集]

秋生さんへ

「dot_plugin」ですね。ありがとうございます。HTMLを見てきました。

.entry_text img {
background-color: #ffffff;
padding: 7px;
border-top: 0px solid #000000;
border-right: 0px solid #808080;
   border-left: 0px solid #000000;
border-bottom: 0px solid #808080;
padding: 7px;
margin: 0px 0px 0px 0px;
float: left;
}
このようになっていますね。
説明です
.entry_text img {
background-color: #ffffff; /*画像背景の色を白*/
padding: 7px;        /*下にあってだぶっているので消してください*/
border-top: 0px solid #000; /*画像の上の線0pxで線がない 数字を入れてください*/
border-right: 0px solid #000;/*画像の右の線 数字を入れてください*/
   border-left: 0px solid #000; /*画像の左の線 数字を入れてください*/
border-bottom: 0px solid #000;/*画像の下の線 数字を入れてください*/
padding: 7px; /*画像と線の間の幅を7pxにする*/
margin: 0px 0px 0px 0px; /*画像の位置上から、右から、下から、左から*/
float: left; /*画像を横並びにする*/
}

もし画像のすぐ横に5pxの黒い線を入れるのでしたら↓

.entry_text img {
background-color: #ffffff;    /*画像背景の色を白*/
     border: 5px solid #000;
margin: 0px 0px 0px 0px; /*画像の位置上から、右から、下から、左から*/
}

これでいかがでしょうか?



どりーみー #JalddpaA/2008/10/06(月) 19:20:32/URL[ 編集]

今晩は。秋生です。

画像を囲う様に線を入れたかったので

.entry_text img {
background-color: #ffffff;    /*画像背景の色を白*/
     border: 5px solid #000;
margin: 0px 0px 0px 0px; /*画像の位置上から、右から、下から、左から*/
}

を使わせて頂き、ちゃんと表示出来るようになりました。

後、画像と文字の間にスペースを入れるのは、

margin: 0px 0px 0px 0px; /*画像の位置上から、右から、下から、左から*/

の数字を変更したら出来ました。

この度は親切なアドバイスを頂きまして本当に有難うございました。
感謝いたします。

秋生 #4eg7mJls/2008/10/06(月) 20:40:19/URL[ 編集]

秋生さんへ

思い通りになったようでよかったですね。
また何かあったら来て下さいね。
私の解かることがあるかもしれません。

どりーみー #JalddpaA/2008/10/07(火) 09:01:30/URL[ 編集]

投稿















管理者にだけ表示を許可する

trackback

trackback url ↓

http://dreamy.blog2.fc2.com/tb.php/16-a10cc2da


| ホーム |

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