|
2008/06/20 22:48
写真の枠を外して写真のサムネイルを横に２つ３つ並べたい
ということですのでやってみました    こんな感じでよろしいでしょうか？ 以下にこの方法を書いてみますね。 画像の枠を外すには 管理ページのお使いのテンプレート「album2」の編集をクリック スタイルシートの /*テキスト内の画像*/と言うところを background-color: #ffffff; padding: 2px; float: left; 意味はfloat: left;が横に並べるということです。今までも入っていましたね。 padding: 2px;は画像と画像の隙間です。0だと写真同士がくっついてしまいますので、1か2くらいはあったほうが良いですね。この記事では2pxにしてみました。 次に 「環境設定の変更」のサムネイル作成のサイズを100〜120くらいにして更新（この数字はBlogを見て決めてください。）この記事では100pxに設定しました。 記事を書く時、 先ず画像をアップする時 １、「サムネイル 同時に作成する(jpg)」にチェックを入れます。 ２、画像のサムネイルで記事を書く をクリック 記事を作成部分に入ったタグの一番最後「 <br clear="all" /> 」を消します。 <br clear="all" />が並べずに左下へと言う意味です。 いかがでしょうか？ 
さっそく記事にして下さってありがとうございます！
これでたくさんの画像を綺麗に並べられそうです。 丁寧な解説本当にありがとうございました。(^^*) これからも応援しています。テンプレートの方大事に使わせてもらいますね。 それでは失礼します。 もみ #-/2008/06/21(土) 00:41:05/URL[ 編集]
もみさん、
うまく出来ましたでしょうか？ いろいろと触っているうちにスタイルシートも面白くなってきますよね。 これからもヨロシク♪ どりーみー #JalddpaA/2008/06/23(月) 16:15:44/URL[ 編集] 荒野鷹虎さま
もしなにか疑問がありましたら質問してみてください。私もしろうとですが
解かることもあるかもしれませんので。 お役にたてれば幸いです。 どりーみー #JalddpaA/2008/07/03(木) 10:41:29/URL[ 編集]
>テンプレート「album2」の編集をクリック<「album2」がでないのです。
管理画面を開いて何処ヲクリックするんでしょうか？ 荒野鷹虎 #-/2008/07/07(月) 00:54:47/URL[ 編集]
荒野鷹虎さまがお使いのテンプレートはこれですね。
ちょっと違って見えるのは 実験のために幅広い画像（例のシクラメンの画像）が入っているからです。 ご質問の「album2」は私の配布のテンプレートなのですが、 荒野鷹虎さまがお使いのテンプレートでやってみますね。 ダウンロードして名前を変えてないなら ・テンプレートの設定 の do_blueskyの 編集をクリック do_blueskyのスタイルシート編集 /* 記事本文 */ .entry_body { text-align:left; font-size:12px; /* 文字サイズ */ color:#006; /* 文字色 */ line-height:1.7; /* 行間 */ margin:0; padding:10px 25px; } の下に .entry_body img { background-color: #ffffff; padding: 2px; float: left; } と書き加えてください。 「環境設定の変更」のサムネイル作成のサイズを100〜120くらいにして更新（この数字はBlogを見て決めてください。） 後はこの記事の「記事を書く時、」からをやってみてください。 どうでしょう？ 一枚一枚が小さい画像にしておけばお客様が来た時ページが早く開きますよね。♪ どりーみー #JalddpaA/2008/07/07(月) 14:22:02/URL[ 編集] 荒野鷹虎さま
羽生名人の記事に始めて横に一枚載せることが出来ました。!!!大感激!｛ありがとう」
ところが、次に遣ったら駄目でした。原因が分かりません。なにかヒントがあれば。よろしく！！ わからずやの親爺より、〈恥） 荒野鷹虎 #-/2008/07/21(月) 09:26:47/URL[ 編集]
わー。出来たんですね。よかったです。
最初の写真のタグの後の＜br /＞が消してあってうまく行きましたね。 http://takatora.blog74.fc2.com/template/do_bluesky_2/style.css拝見しました .entry_body imgがないようですね do_blueskyのスタイルシート編集 /* 記事本文 */ .entry_body { text-align:left; font-size:12px; /* 文字サイズ */ color:#006; /* 文字色 */ line-height:1.7; /* 行間 */ margin:0; padding:10px 25px; } の下に .entry_body img { background-color: #ffffff; padding: 2px; float: left; } と書き加えてみてください。 それから 記事の入るエリアの幅が530pxなので 写真の大きさ幅が 250pxで2枚が 並び150pxにすると3枚くらいが並ぶと思います。 如何でしょうか？ どりーみー #JalddpaA/2008/07/21(月) 10:16:25/URL[ 編集]
|
|
| ホーム |
|
どりーみー(10/12)
荒野鷹虎(10/11)
どりーみー(10/07)
秋生(10/06)
どりーみー(10/06)
秋生(10/06)
どりーみー(10/06)
秋生(10/06)
どりーみー(10/01)
荒野鷹虎(09/30)
どりーみー(09/25)
オートウェーブ富里店(09/24)
どりーみー(09/22)
オートウェーブ富里店(09/22)
どりーみー(09/22)
どりーみー(09/22)
はじめまして(09/22)
clair(09/19)
どりーみー(09/16)
clair(09/16)
どりーみー(09/14)
じもらー(09/14)
どりーみー(09/13)
じもらー(09/13)
どりーみー(09/12)