• ベストアンサー

CSSで横線の引き方を教えてください

LOHAの回答

  • LOHA
  • ベストアンサー率52% (203/388)
回答No.2

実際にソースを見てみなければ分かりませんが、もし入れれるとするならば、線を入れたい場所付近のブロックでpaddingをとって、背景画像でそこに指定することになるかと想定されます。 IEを捨てるならbefore,after使う手もありかもしれません。 ＞なにか根本的に間違ってそうな気もしますが 区切り線はデザインなのでCSSで実装しようという試み自体は間違っていないと思います。 HTMLが編集できないというのは間違っている気がしますが。 ＃あーでもブログのテンプレとかならあり得そうですね 裏技的な方法としてJavaScriptが使えるならそれで誤魔化すと言う方法もありますが。

noname#127176
質問者

補足

ブログのテンプレをいじっていたんですが、まさにそんな感じの指定方法でした。 もしよければ、background:url( );以外で背景画像を指定できる方法を教えてください。 ボーダーっぽく。。。

この回答がついた質問に戻る
回答 全件
ベストアンサー
融通の悪いシステムで、HTMLが触れない場合がありますが、 その場合、…
こんばんは。 ＞htmlが編集できないため 多分、この時点でアウトで…
  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • 【CSS】ナビゲーション　ロールオーバー（画像使用）

    こんにちは。 ナビゲーションをCSSで画像ロールオーバーを試みたのですが 上手くいきません。 下記URLでファイルを参照いただき、どこが間違っているのかご教授いただけますでしょうか。 どうぞ宜しくお願い申し上げます<(_ _)> ＜参照HTML＞http://www.rough-inc.jp/ ＜参照CSS＞http://www.rough-inc.jp/css/style.css ＜使用の画像＞※下記2種類 http://www.rough-inc.jp/images/navi.gif http://www.rough-inc.jp/images/navi_bg.gif

    • ベストアンサー
    • HTML
  • CSSのcurrentを使ったグローバルナビゲーションの作り方

    CSSのcurrentを使ったグローバルナビゲーションの作り方を教えてください。 以下のように二枚のつながった背景画像をロールオーバーさせるCSSのcurrentを使ったグローバルナビゲーションの作り方を教えてください。 画像URLと参考サイト http://www.kagaya.co.jp/images/menu_gNav.gif http://www.kagaya.co.jp/index.php

    • ベストアンサー
    • HTML
  • cssでロールオーバー設定した画像がoperaでは最初のロールオーバーでは非表示になります

    いつもお世話になっております。 以下の様にcssを組みました。 〔ｃｓｓ〕 @charset "UTF-8"; #bnn0513 span { display:none; } #bnn0513 a { display:block; width:212px; height:102px; padding:0; background-image:url(images/sample.gif); background-repeat:no-repeat 0 0; } #bnn0513 a:link { background-image:url(images/sample.gif); background-repeat:no-repeat 0 0; } #bnn0513 a:visited { background-image:url(images/sample.gif); background-repeat:no-repeat 0 0; } #bnn0513 a:hover { background-image:url(images/sample_ov.gif); background-repeat:no-repeat 0 0; } #bnn1 a:active { background-image:url(images/sample_on.gif); background-repeat:no-repeat 0 0; } 〔xhtml（一部）〕 <div id="bnn0513"> <a href="sample.html"><span>サンプル</span></a></div> CSSでロールオーバー設定した画像が、他のブラウザではきちんと表示されるのですが、operaブラウザでは一度目にカーソルをロールオーバー指定した場所に置くと、hover用の画像が表示されず、sample.gifの画像も消えてしまいます。 一旦カーソルを移動させて再び戻すとhover用の画像は表示されます。 一度目にカーソルを置いたときもキチンと表示される様にしたいのですが、どうすればよろしいでしょうか？ java等他のプログラミングが入っても構いませんので方法をご教授ください。 宜しくお願い致します。

    • ベストアンサー
    • HTML
  • 画像をcssでレイアウトしたいです

    以下のボックスにあるイメージをボックスの左上を基準に2x2の形に並べたいです。その際にcssのpositionを使用してrelativeを指定して定義したのですがうまくいきません。正しい指定の方法を教えてください。 <div id="bottom_right"> <img src="images/image1.gif" width="176" height="57" /> <img src="images/image2.gif" width="176" height="57" /> <img src="images/image3.gif" width="176" height="57" /> <img src="images/image4.gif" width="176" height="57" /> </div>

    • ベストアンサー
    • HTML
  • 画像をCSSのurlを使って表示する方法

    ./gazou/background/bg005.gifこちらに画像ファイルがあるのですが、この画像をCSSのurlを使って表示するときどのように指定すればよいのでしょうか？ ./basecss.cssに background-image :url("./gazou/background/bg005.gif");と記載してもうまくいきません。 カレントデイレクトリはすべて同じデイレクトリです。 CSSもカレントデイレクトリは./ではないのでしょうか？ほかのフォルダにある画像ファイルは問題なく表示されます。 {background-image:url("../test/gazou/background/bg006.gif"); 上記はうまくいく。

    • ベストアンサー
    • CSS
  • background　水平指定と垂直指定

    お世話になっています。 ＣＳＳで画像の水平指定と垂直指定が未だよく解っていないので 教えてください。 ｗidth：214pxのnavi.gifをおいた場合 #header li#about a:hover { background: url(../images/navi.gif) -32px 0; } #header li#clients a:hover { background: url(../images/gnavi.gif) -76px 0; } この-32px,0pxや76px,0pxの意味はどういう意味なんでしょうか？ すみません、解る方、お願い致します。

    • ベストアンサー
    • HTML
  • CSSでの画像指定について。

    CSSでの画像指定について。 ファイルパスの指定について教えてください。 フォルダ１の中に「sample.html」、「sample.css」、「img」フォルダが入っており、 「img」フォルダの中に、「nature_01.gif」が入っています（下図）。 -------------------------------------------------------------------------- フォルダ１ L sample.html L sample.css L img（フォルダ） 　img(フォルダ) 　L nature_01.gif 　 ---------------------------------------------------------------------------- このファイル構成だと、sample.css の中で 『background-image:url(/img/nature_01.gif)』のようにパスを指定すれば良い と理解していたのですが、背景に画像が表示されませんでした。 その後、下記のように修正すると、画像が表示されるようになりました。 firefox3.5 →修正後は画像が表示される。 Internet explore 8 →修正前、修正後ともに表示されない。 ----------------------------------------------------------------------- 【修正前】 #contents{ width:750px; background-image:url(/img/nature_01.gif); 【修正後】 #contents{ width:750px; background-image:url(../img/nature_01.gif); ------------------------------------------------------------------------ OS・・・windows xp なぜ、こうなるのか、わかるかたがいましたら教えてください。 よろしくお願いします。

  • CSS内で呼び出してる画像に対して、class属性をつけたい

    CSS内で呼び出してる画像に対して、class属性をつけたい お世話になります、CSSに関して下記のようなことは可能なのでしょうか。 とあるライブリにimgタグにclass属性を指定して使用するものがありました。 例：<img src="image.gif" class="○○"/> （クラスを指定すると画像にエフェクトがかかる） これをcssで下記のように呼び出している画像に対して適用することは可能でしょうか。 [cssファイル] #bkg .opt1 { background: url('画像のパス'); } [html] //こんな感じで呼んでいる <li class="bkg opt1"><span>image</span></li> CSS内でクラス指定ができないものかと色々試してみたもののうまくいきません・・ 適用方法、ヒント等教えていただけますでしょうか よろしくお願いします

  • 外部CSSで画像にリンクを貼りたい

    まだCSS初心者ですので宜しくお願いします。 外部CSSに位置指定した「画像」にリンクを貼りたいのですが いろいろ調べてもその方法がわかりません。 以下のタグにどのようにリンクの指定をすればよいでしょうか？ div#index{ margin-top:5px; background:url(../img/oribox.gif) no-repeat right bottom; } また、HTMLにはどのように記述したらよいかも宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • CSS　背景画像の指定（　）内に""を入れる？

    CSSの背景画像のソースでどちらが正しいのか教えてください。 【Aパターン】 body{ background-image:url(images/＊＊＊.jpg); } 【Bパターン】 body{ background-image:url("images/＊＊＊.jpg"); } の（　）内に" "（ダブルクォーテーション）を付ける・付けないで関係なく、結果としてはどちらも背景画像が表示されます。　 背景画像の指定するサイトを見ても、付いてたり・付いてなかったり…書籍でも特に具体的に""←について詳しく載ってないのですが、実際どちらを使う方がが正しいですか？

    • ベストアンサー
    • CSS

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する
質問する