FC2ブログ

無料新規登録

テンプレート・プラグイン

一番上の枠一杯に画像を挿入したい。

今日は、

前回の質問にはマナナンさんにヒントをいただきました。
ありがとうございました。
メールフォーム設定方法ご教授願います。

今回は公式テテンプレートの改造において、ファイルにある写真画像をある部分に挿入したいんですが、どうしても表示されません。
カスタマイズマニュアル上で、入力する箇所が間違っているのか、入力の式が違うのか、検討がつきません。
分かる方いらしたら、ご教授願います。
使用公式テンプレートは　grey-3colum です。
(お手数ですが　Demeeブログ参照願います。一番上のグリーンの枠一杯に写真を使いたい。）
またその枠のサイズは変更できますか？

宜しくお願いいたします。
hih



by   2009年08月09日 15:59
by 
2009年08月09日 15:59

コメント一覧 新しい順に表示▽ / 古い順に表示△

コメント一覧
新しい順  |  古い順

このコミュニティにご参加頂くと、コメントの書き込みができます

  • manannanさんありがとうございました。
    なんとかできました。

    画像バスが違っていました。
    写真が小さいのか連続で貼り付けらていますが、これでＯＫです。

    感謝！感謝！

    また何かありましたら、宜しくお願いいたします。

    hih
    by   2009年08月21日 16:29
    by 
    2009年08月21日 16:29
  • ＞http://unwindhih.blog83.fc2.com/Unwind+night2_convert_20090806145541.jpg

    画像のURLの確認をお願いします。(少なくとも、うちのサーバーとは画像URLのつけかたが異なっているので）
    うちはこんなです。
    http://blog-imgs-23-origin.fc2.com/m/a/n/manannan/colorfree-menu.png

    今回はバナーではないのですが、
    公式マニュアル「バナーの設置手順」（http://fc2blogmanual.blog60.fc2.com/blog-entry-77.html ）のなかに、「画像のパスを調べる」という項目があります。この手順で、画像のパスを調べてください。
    by manannan  2009年08月21日 12:08
    by manannan
    2009年08月21日 12:08
  • ご推奨サイトを見てもどうもうまくいきません。

    div#header {
    width: 100%;
    padding-bottom:40px;
    padding-top:40px;
    margin-bottom: 60px;
    background-image: url("http://unwindhih.blog83.fc2.com/Unwind+night2_convert_20090806145541.jpg");
    background-position : left top;
    background-attachment : fixed;
    background-color: #999900;
    }

    スタイルシートは上記のように入れました。
    画像は自分のダウンロードファイルにあるものです。
    urlの設定はこれでいいんでしょうか。
    そしてスタイルシートで入力変更した後、ＨＴＭＬソースも自分で変更しないといけないということでしょうか。スタイルシートで変更したものは、自動的にＨＴＭＬに反映されないんでしょうか。

    上記サイトのスタイルシート（目的別）の項目には下記のように記載されています。

    スタイルシート部分は外部ファイル（sample.css）に記述。
    p.sample {
    color: #000000;
    background-color: #f8dce0;
    background-image: url("../images/kabe01.gif")
    }


    HTMLソース
    <html>
    <head>
    <link rel="stylesheet" href="sample.css" type="text/css">
    </head>
    <body>
    <p class="sample">
    壁紙を使いこなせるようになると制作の幅が大きく広がります。壁紙はホームページを個性的に彩ります。
    </p>
    </body>
    </html>

    なんとも素人で申し訳ありませんが、
    更なるご教授をお願いいたします。

    hih

    by   2009年08月20日 23:27
    by 
    2009年08月20日 23:27
  • マナナンさん、2つのお答えありがとうございました。

    早速試してみます。

    hih
    by   2009年08月10日 17:37
    by 
    2009年08月10日 17:37
  • HTMLのソースを見ると、
    <div id="header">
    <h1><a href="Http://unwindhih.blog83.fc2.com/" accesskey="0" title="～緩めて充足、幸せライフのための提案～">～緩めて充足、幸せライフのための提案～</a></h1>
    <p>読者の方が少しでもホッとでき、人生の小さな幸せを積み重ねられたらと願いつつ、快適なライフスタイルを演出するためのチョットしたヒントを「食」や様々な分野、経験、考え方からピックアップして、写真・文章で綴ってみます。</p>
    </div><!-- /header -->
    となっていますので、

    スタイルシートの
    div#header {
    （略）
    background:#999900;
    }
    を変更します。

    http://www.htmq.com/style/index.shtml#moj
    を参考にしてください。

    このテンプレートは「リキッドタイプ」といって、閲覧窓のサイズがかわると、
    ＞一番上のグリーンの枠
    の幅が変わります。
    小さな写真を入れると、閲覧画面が大きいときには、写真を繰り返させるか、余白を「単色」で埋めるかになります。
    大きな写真を入れると閲覧窓のサイズが小さいときに写真が切れます。右を切るか左を切るか両端を切るか、という選択になります。
    どのような選択をするかによって、設定方法が変わります。（上記参照リンクに全部説明はあります）
    by manannan  2009年08月09日 23:36
    by manannan
    2009年08月09日 23:36

5件中、1～5件表示

Copyright(c)1999 FC2, Inc. All Rights Reserved.