• ベストアンサー

cssについて

現在ｃｓｓの作成練習をしているのですが上手くいきません。 このサイト→http://sample.hisa-hide.com/を編集しているのですが（ｃｓｓは→http://sample.hisa-hide.com/sample.html） floatの回り込みが出来ずに、行き詰まっています。またブラウザによる表示の差が酷いです。 リアルタイムエディタで編集しているのですが→ http://www.2step-css.com/ サーバーにアップすると何故か表示が大きく崩れます。 どなたかこのサイトのｃｓｓの模範解答がわかる方ご回答お願いいたします。

  • CSS
  • 回答数1
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
  • 918BG
  • ベストアンサー率48% (476/984)
回答No.1

cssを問題にする以前に、HTML の基本構造が間違っています。 確認した訳ではありませんが、経験的に考えて、表示の乱れもそこから来ているのだと思います。 すなわち、「このサイト」の HTML ソースをごく大まかに見ると、 <HTML><META> <html lang="ja"> <HEAD> <META> </HEAD> <BODY> </BODY> </HTML><P><A></A></P> といった構造になっていますが、どこが違っているかおわかりですか? <HTML>の開始タグがふたつ連続してあるのに、</HTML>の終了タグはひとつしか無い。 同じ内容のメタタグ <META> が重複して存在する。しかも一組は間違った位置に記載されている。 </HTML>で全部の記述が終わらなくてはならない筈なのに、その後にパラグラフ<P>とアンカー<A>の余計なタグがくっ付いている。 このあたりを修正してからもう一度cssの働きをチェックしてみてはいかがでしょうか?　かなりまともになる筈ですけどね。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. CSS

関連するQ&A

  • ｃｓｓについて

    現在ｃｓｓの作成練習をしているのですが上手くいきません。 このサイト→http://sample.hisa-hide.com/を編集しているのですが（ｃｓｓは→http://sample.hisa-hide.com/sample.html） floatの回り込みが出来ずに、行き詰まっています。またブラウザによる表示の差が酷いです。 このサイトで編集しているのですが http://www.2step-css.com/ アップすると何故か表示が大きく崩れます。 どなたかこのサイトのｃｓｓの模範解答がわかる方ご回答お願いいたします。

  • cssでの作成

    cssでの作成が上手くいきません。以下サイトのｃｓｓの模範解答を書いていただける方、ご回答お願いします。 http://sample.hisa-hide.com/

  • ボックスの作り方【CSS】

    ボックスの作り方【CSS】 下記のサイトにボックス？が多数並んでますが、これはどうやればCSSで表現できるでしょうか。 HTMLのtableだったら出来るのですが、下記のサイトのようにCSSでやりたいのですが。 http://www.2step-css.com/ 『CSS ボックス 装飾』など思いつく単語で検索してみたのですが、なかなかたどり着かないので。 詳しい方いらっしゃいましたらご教示ください。 よろしくお願いします。

    • 締切済み
    • CSS
  • jspでcssが読み込まれません。。

    練習で簡単なwebアプリケーションを作成しているのですが,jspでcssを読み込みたいのですが、なかなか読み込めません。 サイトなどを参考にしながら、コードを書いてみたのですがなかなか読み込まれず困ってます。 開発環境 OS fedora11 eclipse3.5 Tomcat 5.5.27 struts1.3.10 ブラウザ Firefox3.5.4 Eclipse内のプロジェクト構造 sample(プロジェクト名) 　aaaaaa（パッケージ／java） 　bbbbbb (ファイル) 　cccccc (ファイル) 　WEB-INF（WEB-INFの配下にはlib,pages,xmlファイルがあります） 　　lib 　　pages（pagesの配下にはcss,jspファイルがあります） 　　　css（cssの配下のcssファイルを読み込みたい） 　　　　sample.css 　　　jsp (jspの配下にsampleファイルがあります) 　　　　sample(sampleの配下にはsample.jspがあります) 　　　　　sample.jsp sample.jspの中には下記のように書いてあります。 <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta http-equiv="content-style-type" content="text/css"> <link rel="stylesheet" href="pages/css/sample.css" type="text/css"/> </head> sample.cssはhttp://www.stylish-style.com/csstec/basic/b-table-deco.htmlの２をそのまま書いています。 参考にしたサイト http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1313643858 http://www.atmarkit.co.jp/bbs/phpBB/viewtopic.php?topic=36945&forum=12 Firefoxで確認するとエラーも特になく表示されるのですが tableで指定した枠が表示されなくて困っています。 よろしくお願いします。

    • ベストアンサー
    • Java
  • CSSレイアウトでこのようなことはできる？

    ホームページをテーブルを使用しないCSSレイアウトで作成しようと思います。 左右を分けるのにfloatを使用して作っています。 横幅は30%と70%で分けていますが、ブラウザの幅を小さくすると上下にずれてしまいます。 そこでブラウザで800px以下になった時は横バー表示するようにしたいです。 このようなことはできるでしょうか？

  • CSSの外部ファイル使用に関して。

    ビスタorＥＭエディターを使用しています。 ～～index html～～ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8" /> <title>cssの勉強</title> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> <body> <h1>見出し</h1> </body> </html> ～～mystyle.css～～ h1 { color: blue; } このようにテキストエディタも２つに分けて編集しデスクトップへ 保存してブラウザ上へ出力させたのですが文字の色が表示できません。 表示できないというよりもblueで組んだ際にはblueとなりblueをredにした際には 黒になったり、デスクトップ画面上で新規にフォルダをつくそこにhtmlファイルを 入れてその後ブラウザ表示をすると文字がきちんと赤になっていたり 意味がわからず、ずっと悩んでいます。 分かりにくい質問ですいませんどうすればそうならないのか教えていただければ幸いです。 また、毎回アイコンをグーグルクロームのブラウザへドロップして検証するのが めんどうになってきたので、そうせずにブラウザへ直で表示できる方法も教えていただけると嬉しいです。

  • テーブルタグをCSSにしたい

    Abi-Station式更新履歴管理のテーブルタグをCSSにして表示させたいと思っているのですが、 結構複雑でうまくCSSで表示出来ません。 【テーブルタグ表示サンプル】 http://ani.omegumi.com/whatnew.html このようなテーブルタグをCSSにするにはどうしたらいいでしょうか？ また、どこかに変換してくれるソフトみたいなのはないでしょうか？

    • ベストアンサー
    • HTML
  • ｃｓｓについて質問です。

    ホームページ作成の勉強をしている者です。 分からないことがあるので質問させてもらいます。 http://www.htmq.com/csskihon/401.shtmlこのサイトのｃｓｓのソースに float:left; /*リスト項目を横に並べる*/ display:inline; 　　　/*リスト項目をインライン表示にする*/ こう書かれていました。 display:inline;ですでにリストが横になるので、float：ｌｅｆｔ；で横に並べる必要があるのですか？ 調べてもいまいち納得いく答えが見つからないので分かる人教えてください。

    • 締切済み
    • CSS
  • CSSのデザインがうまくいきません

    表示ファイル http://www.loplopland.com/newfile.html CSSファイル http://www.loplopland.com/sample_l_180_490.css この外部CSSで直したいところは １．フッターの上の部分に余白ができてしまったので消したい。 ２．メイン表示部分が下までバックグラウンドイメージを表示したい。 以上の２点を改善したいんですが、うまくいきません。 どのように直したらいいかご教授下さい。 おねがいします。

    • ベストアンサー
    • CSS
  • レスポンシブデザインのCSSについて質問です。

    レスポンシブデザインのCSSについて質問です。PCで閲覧した時は、文章を左寄せ、画像を右寄せで表示させて、スマホで閲覧した時は、文章の下に画像を配置する方法を教えて下さい。 ちなみに私の場合はPC用サイトを以下のように作成していますが、スマホではどのようなCSSにすればいいのか、わからずに悩んでいる状況です。可能であれば、簡単なサンプル・ソースを教えていただけると嬉しいです。よろしくお願いします。 ■html <p><img src="gazo.png" class="photo">このページはサンプルです。</p> ■css .photo { float: right; width: 230px; position: relative; }

    • 締切済み
    • CSS

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する