注目タグ

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

トピック詳細

記事欄画像の中央寄せはどのようにするのですか?

旧フォーラムの記事です http://blog.fc2.com/forum/viewtopic.php?f=3& t=10642
hayamazaimokuza 2006-06-01 03:25:40
件名 :記事欄画像の中央寄せはどのようにするのですか?

先輩方々、是非お教えください。
テンプレート tw_3col_22(3カラム) をお借りしてカスタム中です。

1.記事欄画像の中央寄せはどのようにするのですか?

2.画像のみを中央寄せ、画像の下から始まる文章を左寄せ
  は可能ですか?

宜しくお願い申し上げます。

2006年06月01日 03:25  by FC2スタッフ

コメント一覧 23件中、1~10件表示

  • 旧フォーラムの記事です
    sugar 2006-07-19 15:09:21
    件名 :

    ここにいると、日に日にW3Cが嫌いになるので困っております。

    IEが対応しさえすればと思うのは私だけでしょうか?

    未登録ユーザさん、もじら組のtips以前読んでいたのにすっっっっっっっっかり失念していました(ということは身に付いて ない)。ありがとうございました。

    簡便に中央寄せできるといいのに……。
    実験で中央寄せにしたのはとりあえずそのままにしておくことにします。

    2006年07月19日 15:09 by sugar & FC2blog beauties

  • 旧フォーラムの記事です
    麻生(AdanKadan) 2006-07-19 14:21:24
    件名 :

    ↓のスレッドでも、類似の話題が展開しておりました。
    <a class="postlink" href="http://blog.fc 2.com/forum/viewtopic.php?t=11601">http://blog.fc2.c om/forum/viewtopic.php?t=11601</a>

    個人的には<center>派です。

    ここにいると、日に日にW3Cが嫌いになるので困っております。

    2006年07月19日 14:21 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-07-19 14:15:48
    件名 :

    私は画像を記事の挿入し、その画像を中央に表示するときは

    <center>画像</center>

    で記事を書いていますが「FAQよくある質問と答え」の中の「画像を中央に表示したいのですが」の答えでは

    <div align="center"><画像タグ></div&g t;

    と回答してあります。しかし、同掲示板では

    <div style="text-align: center;">画像</di v>

    と回答してあるところもあり、いったいどれを使えばいいのかわかりませんし、

    <div align="center"><画像タグ></div&g t;

    <div style="text-align: center;">画像</di v>

    の違いもわかりません。

    画像を中央表示で記事を書きたいときは一体どれを使うのがベターなのでしょうか?

    2006年07月19日 14:15 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-07-19 12:26:33
    件名 :

    ただしsugarさんのページも標準モードでの表示ならセンタリングされます。
    失礼ながらドキュメントタイプを書き換えてテストしてみましたら、出来ました。
    (何回にも分けての投稿スミマセン)

    2006年07月19日 12:26 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-07-19 12:18:52
    件名 :

    そうそう、IEはそもそもブロック要素のセンタリングに margin:auto は使えないのですよ。
    <a class="postlink" href="http://www.moz illa.gr.jp/standards/webtips0004.html">http://www.mo zilla.gr.jp/standards/webtips0004.html</a>

    2006年07月19日 12:18 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-07-19 12:10:24
    件名 :

    デスクトップの画像ですよね。
    残念ながらWin+IE6では左に寄っています。
    Firefoxでは効いているのですが。。。 <img src="{SMILIES_PATH}/ico n_sad.gif" alt=":(" title="Sad" /&g t;

    2006年07月19日 12:10 by FC2スタッフ

  • 旧フォーラムの記事です
    sugar 2006-07-19 11:43:39
    件名 :

    1ヶ月半経って少し賢くなったかも、のsugarです。

    imgはインライン要素なので、text-align:centerで合っているはずですが
    IEでセンタリングしてくれないので、どうしたものかというのがありました。

    ブロックレベル要素にしてmarginでやってみたらどうかというのでやってみました。
    (改めてこのトピックを見ると、未登録ユーザさんが左寄せの例を示してくれていたんですね^^:)

    img{disp lay:block;
    margin:auto;
    }
    現在browsershots のサーバ にアクセスできず、IEでチェックできないのですが中央寄せになっているでしょうか?

    <a class="postlink" href="http://bitters weetdreams.blog9.fc2.com/blog-entry-597.html">http:/ /bittersweetdreams.blog9.fc2.com/ ... y-597.html</a>

    2006年07月19日 11:43 by sugar & FC2blog beauties

  • 旧フォーラムの記事です
    Anonymous 2006-06-03 18:24:31
    件名 :脱線ついでに

    <div style="text-align:center;"><im g src="画像URL" alt="画像名等"></div>
    本文

    と、
    麻生さんからお教えいただいた
    <center><img src="[URL]"…></center >

    この2つにはどのような違いがあるのでしょうか?


    簡単に言うと、<center>という要素はもともとが独自拡張で作られた要素なので使用せずに、より多くのの ブラウザでセンタリングするには<div style="text-align:center;"& gt;〜</div>や<div class="XXX">〜</div& gt;とCSSを使う、という風に覚えておけば間違いないです。

    画面に表示されているものは、すべてCSSで制御されています。
    <div style="text-align:center;"><img sr c="XXX" /></div>
    とHTMLに書かれてあっても
    div img &#123;
    display:block;
    float:left;
    &#125;
    とすれば左寄せになります。

    見映え(CSS)は後からある程度の自由が効きますが、文章構造(HTML)つまり著者が文章に与えた意味は、ほぼひとつの はずで、見映え優先にした色々な書き方をするのは得策ではないと思います。

    あるイメージがあり、それは文章と繋がっているのか(インライン要素)、わけて示したいのか(ブロック要素)でHTMLの書 き方を変え、見映えは後で考えるようにするのが正解・・・なんですが、自分もできていません_| ̄|○

    2006年06月03日 18:24 by FC2スタッフ

  • 旧フォーラムの記事です
    わや 2006-06-03 04:06:31
    件名 :

    <div> 〜 </div> を追加するのには、そういう理由があったのですね。
    私もそこまでは思い至りませんでした。
    (うあ〜、我ながらもっと勉強が必要です…。)

    <br clear="all" /> も、私にはレイアウト上邪魔でしかない存在だった のですが、必要だと思う方もいて
    それにはきちんと理由があるのだなぁ…と、改めて考えさせられたり。

    どもども、いつもいつも、回答者の皆さんの知識をわけていただいて感謝!
    の、今日この頃です。(すいません、ちょっと話がそれてしまいました)

    2006年06月03日 04:06 by FC2スタッフ

  • 旧フォーラムの記事です
    sugar 2006-06-03 02:01:31
    件名 :


    <div style="text-align:center;"><img src ="画像URL" alt="画像名等"></div>
    本文

    と、
    麻生さんからお教えいただいた
    <center><img src="[URL]"…></center >

    この2つにはどのような違いがあるのでしょうか?


    前者はCSSで中央寄せをしていて、後者はHTMLで中央寄せをしています。

    世の中の流れでは、ウェブサイトの見栄えはCSSで行う方向に向かっています。
    FC2ブログでも、基本はCSS、ということから上記にしたのですが
    上記は微妙に間違っていて(すみません)、
    修正しようとするともうひとつ<div>〜</div>を書かなければなりません。
    細かいところにこだわらなければ、HTMLでもいいかもしれません(書く量が少ない 苦笑)。

    外部CSS(FC2ブログで言うところのテンプレートの編集の下のファイル)で
    簡単に中央寄せができれば、
    HTMLはクラスを指定するだけで、外部CSSで行う方がスマートですし、
    後にテンプレートを替えたときも、
    中央寄せでなく左寄せにしたい、右寄せにしたいとなったときにも
    外部CSSの一箇所を変更するだけで良いので利点があったのですが
    こちらも余白云々の話になってしまい、
    それを調整しようとするとどうしてももうひとつ<div>〜</div>が必要そうです。

    結論:この際、HTMLで中央寄せにする?
    (?がついては結論になりませんね^^;)

    2006年06月03日 02:01 by sugar & FC2blog beauties

1 2 3 > >>