• ベストアンサー

外部スタイルシートについて

「@rt web」というテンプレートを使いホームページ制作しようと考えていますが、そのテンプレートのスタイルシートは外部スタイルシートになっていません。 http://www.ddnj.com/product/hp/artweb/index.html これを簡単に外部スタイルシートにする方法はないものでしょうか？ 簡単ではなくても外部スタイルシートに設定し直す手順を教えて頂けると助かります。 ソフトはDreamweaver４を使っています。 どうぞよろしくお願いします。

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

  • ベストアンサー
  • sr-agent
  • ベストアンサー率43% (594/1373)
回答No.4

テーブルタグを使わないためには正しいHTMLタグを使え、 正しいスタイルシートを使えることが望ましいと思います。 レイアウトはテーブルタグではなく、スタイルシートで行うとよいでしょう。 HTMLの基本については とほほのWWW入門 http://www.tohoho-web.com/www.htm というサイトさま、 スタイルシートなどについては http://www.kanzaki.com/docs/html/htminfo17.html や http://www.openspc2.org/reibun/css/ あたりがよいかもしれません。 ただ、人によって好みが異なりますので、 HTMLやスタイルシートというキーワードでそれぞれ検索してみてください。 でも今できなくても焦る必要は全然ありません。 ・・・自分もネットを始めた（ほぼホームページを持ち始めた）時から、4年程度は理解するのにかかっていますので（でも今でも完璧に理解できているかと言うとそういえませんが・・・苦笑） もし納期がいつまで、と決められているのでなければ、じっくり時間をかけて自分の納得の行くホームページを作ってくださいね。

focus69
質問者

お礼

分かりやすいアドバイスありがとうございます。 焦らず地道にやってみます！

その他の回答 (3)

  • sr-agent
  • ベストアンサー率43% (594/1373)
回答No.3

なお、これは個人的な意見ですが、テーブルタグをレイアウトに使っている上、テーブルの中にテーブルが2重に入っています。 このような使い方をすると、表示が遅くなりますし、 （内側のテーブルを表示してから徐々に外側を読み込んでいくらしいので） テーブルタグの閉じ忘れをする可能性も高くなりますので あまりおススメできません（苦笑） IEの場合は閉じ忘れをしても見えますが NNの場合、閉じ忘れをすると、全くテーブルの中身が表示されず、 ページが真っ白！ということになりかねません。 ・・・以前に実は・・・ 「私ネスケなんだけどページが真っ白で見えない！」って言われたことがあるんですよ。 自分から（IE）は見えているのにへんだなぁって。 原因は・・・閉じ忘れでした。 ので極力レイアウトのためのテーブルタグは使わないようにしようって。

focus69
質問者

お礼

ありがとうございます。 テーブルタグを使わないとなると・・・。 勉強するのに何か良いサイトはあるでしょうか？ 何度も済みません。アドバイス頂けるとうれしいです。

  • sr-agent
  • ベストアンサー率43% (594/1373)
回答No.2

おそらくお考えのとおりでよいと思います。 例えばソースファイルは <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <title>company_website18</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta name="Description" content="Made By Web Design Template @rt_web Designed With TimeLineDesignUnitLens"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" href="content.css" type="text/css"> </head> <body background="image/bg_back.gif"> <table width="701" border="0" cellpadding="0" cellspacing="0" background=""> <tr> <td width="693" valign="top" bgcolor="#ffffff"> <table width="693" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="15"><img src="image/spacer.gif" width="15" height="50"></td> <td width="332"><img src="image/obj_sitetitle.gif" width="192" height="20"></td> <td width="331" align="right"> <table border="0" cellspacing="0" cellpadding="3"> <tr> <td><img src="image/obj_lastupdated.gif" width="74" height="13"></td> <td><font color="#669966" size="2">20xx/00/00</font></td> </tr> </table> </td></tr> </table> </td></tr></table> </body> </html> スタイルシートは body { margin: 0% 0% 0% 0%; color: #666666; background: #ffffff } a:link { color: #006699; background: #ffffff } a:visited { color: #996699; background: #ffffff } a:active { color: #ffcc00; background: #ffffff } という感じになるのではないかと思います。 （tableタグが不足しているようなので編集しなおしています。）

focus69
質問者

お礼

sr-agentさん、ありがとうございます。 とにかくやってみます。 詳細に亘るアドバイスに感謝しております。

  • sr-agent
  • ベストアンサー率43% (594/1373)
回答No.1

お使いのソフトを使ったことがありませんので参考になるかどうかわかりませんが、 まず、ファイルの「ソース」を見て、 <meta http-equiv="Content-Style-Type" content="text/css"> というタグがない場合には、このタグを書き加える。 そして、 <link rel="stylesheet" type="text/css" href="okwave.css"> というタグを書き加えます。 okwave.cssというところには、実際にスタイルシートで使用するファイル名を入れます。 同じディレクトリにスタイルシートのファイルを置いているなら 上記のとおりでよいですが 違うディレクトリにおく場合は、記述のしかたが若干違ってくると思います。 なお、もしスタイルシートに関する文章がテンプレートの中にある場合には <style type="text/css"> <!-- body { margin: 2% 10% 2% 10%; color: #000000; background-color: #ffffff } ・ ・ ・ --> </style> という部分を削除されればよいのではないかと考えられます。 以上ご参考まで。 もしHTMLではなくXHTMLで書いている場合には、 <meta http-equiv="Content-Style-Type" content="text/css" /> と括弧を閉じる部分の表現が異なります。

focus69
質問者

お礼

sr-agentさん、ありがとうございます。 補足ですが、前半のソースはこんな感じなんです↓ fontのサイズやbgcolorがそれぞれの箇所で書かれている状態です。 これらを外部スタイルシートに書くんですよね。そして、改めてそれぞれの場所で関連付けていく。←合ってますか？ <html> <head> <title>company_website18</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta name="Description" content="Made By Web Design Template @rt_web Designed With TimeLineDesignUnitLens"> </head> <body bgcolor="#FFFFFF" background="image/bg_back.gif" text="#666666" link="#006699" vlink="#996699" alink="#FFCC00" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table width="701" border="0" cellpadding="0" cellspacing="0" backbround=""> <tr> <td width="693" valign="top" bgcolor="#FFFFFF"> <table width="693" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="15"><img src="image/spacer.gif" width="15" height="50"></td> <td width="332"><img src="image/obj_sitetitle.gif" width="192" height="20"></td> <td width="331" align="right"> <table border="0" cellspacing="0" cellpadding="3"> <tr> <td><img src="image/obj_lastupdated.gif" width="74" height="13"></td> <td><font color="#669966" size="2">20xx/00/00</font></td> </tr> </table>

  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

関連するQ&A

  • dreamweaverでの外部スタイルシート

    こんにちは、htmlファイルと、外部cssでwebpageを作ろうと試みている初心者です、お願いします。 環境は、mac osX、テキストエディット、dreamweaver cs3、です。 htmlファイルを外部スタイルシートでコントロールしたい部分があり、外部スタイルシートはdreamweaverにしています。（というよりすべての素材は、はじめはテキストエディトから作っており、cssの名で保存したものに関してはdreamweaverで開かさるので強制的にです。） ひとつのhtmlファイル単体の更新の場合、テキストエディットを保存後、safariブラウザ開くという方法で、更新の結果、出来栄を見ていましたが。 dreamweaverを使っての外部スタイルシートの内容を変え、更新しようとしても更新の結果がsafariブラウザに反映されません。（ちなみに、詳しくは、dreamwaverの外部スタイルシートをいじり、これをdreamweaverで保存。その後、htmlファイルを開いてみる。という手順ですが、これが上手く反映出来ていないという事です。） これはどうしてかお分かりの方、是非お願いします。

    • ベストアンサー
    • Mac
  • UTF-8を指定すると外部スタイルシートが効かなくなります。

    現在海外の方へ向けて英語のwebサイトを制作しており、 WinXPのDreamWeaverで作成し,全て英語で記述しているのですが、 <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> ↑この記述から ↓この記述に書き換えると外部javascriptに記載されているスタイルシートが効かなくなります 。 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> スタイルシートは外部に記述しており、 HTMLファイルに記載されているスタイルシートは効いています。 javascriptにだけなぜスタイルシートが効かないのでしょうか？ このような場合の解決策を知っていらっしゃる方がいたら、教えてください。 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 外部スタイルシートが反省されない

    ホームページビルダー２００１で外部スタイルシートを使ってＨＰ作成しましたがビルダーでプレビューしてみるとちゃんとなってるのに アップロードしたら全く反映されてません。 色々調べましたがわからないのです。 自分で思うにスタイルシートの名前が漢字で全角なのは構わないのでしょうか？ よろしくお願いします。

  • 外部スタイルシートについて

    いつもありがとうございます nenenomitiです。 先生方、今日もよろしくお願い致します。 ホームページビルダー９を使用して HP作成にあたっていますが 「外部スタイルシート」についての 記述がまったくありません。 私が今、困っていることは １ページごとの文字サイズが違うことです 大量の情報を書き込む場合は 文字フォントを－１に設定していました そして、情報量の少ないページは見やすいように 普通サイズで書き込んでいます 第三者からのご意見はまだ聞いていませんが 自分でも見ていても なんか～おかしいような感じに見えます 外部スタイルシートを設定すると １ページ毎に設定し直さなくても良いと　聞きました。 ただ、どんなサイトの説明を見ていても イマイチ、外部スタイルシート設置について 理解が出来ません。 どなたか私に判り易く説明を出来る方は おられませんでしょうか？ よろしくおねがいいたします。

  • 外部スタイルシートを覗かれない方法

    外部スタイルシートを使ってますが、アドレスバーにCSSのアドレスを入力してみると、HP作成ソフトに自動的にダウンロードされてしまいました。 これは他の方がアクセスしても同じようになるのでしょうか？ 外部スタイルシートが覗けてしまう状態になるのですか？ 初心者質問ですみませんが、よろしくお願いいたします。

  • 外部スクリプトとスタイルシート

    とある質問にあったHPのソースを見たところ外部にJavaScriptとスタイルシートのファイルを置いて そこからリンクしているみたいでした。 そして外部ファイルをローカル(パソコン)にダウンロードして中身を メモ帳で見たのですが↑などの変な記号でぎっしりにつまっていました。 スタイルシートのほうは@もありました(@importなど) 文字化けのように見えるのですがこれは文法(スクリプト)としては正しいのでしょうか？ 直接ソースに書いてあるようにスクリプトを見るにはどうしたらいいでしょうか？ ちなみにここのHPです http://www.blogger.com/start

    • ベストアンサー
    • HTML
  • ビルダー6.5で（外部）スタイルシートが理解できない・・・

    ホームページビルダー6.5でHPを作っています。 サイト全部の背景色が今現在「赤」なのですが、これを「黒」に変えたいと思いました。 しかしページ数が半端じゃなく多くて1枚1枚開いては設定・・・というのが大変面倒です。 調べてみると、どうやら外部スタイルシートを使ったら良いとのことなんですが、よくわからないのです。 コチラhttp://hpb.cool.ne.jp/hpbuilder/ss_gaibu.htmを見ますと、外部スタイルシートの前にスタイルシートが出来ないといけないみたいで？？？　スタイルシートと外部スタイルシートとは別物なんでしょうか？ いまいち仕組みが理解できません。 理解できていないまま、とりあえず1ページだけ実験的にやってみたら、背景色は変わったのですが表の中の色までは変わりませんでした。表はスタイルシートで制御出来ないのでしょうか？ なんだか大変混乱してしまい、ご助言いただければありがたいです。

  • 外部スタイルシートへのリンク方法、パスのhtml

    外部スタイルシートへのリンク方法 ※　具体的なパスの書き方、htmlを教えてください。 当方ＨＰを作成しています。 ＸＸＸＸＸ.comというサイトに“ＣＳＳ”で書式スタイルを定義しています。 ＸＸＸＸＸ.com内の“ＣＳＳ”ですので、 ＸＸＸＸＸ.comの中であれば、定義した文字がしっかり反映されています。 これは普通のことです。 さて、このページに、とある外部フォームページ（他社ＣＧＩによるもの）を組み込みました。 そのフォームページは外部のプログラムなので、ＸＸＸＸＸ.comの画像を使用するにしても、 スタイルシートを使用するにしても、ＸＸＸＸＸ.comに対して“パス”を指定する必要があります。 で、画像の場合は、 http://www.ＸＸＸＸＸ.com/画像の名前.gifでなんなくリンクさせることには成功。 しかし、スタイルシート（ＣＳＳ）へのリンクが、成功しません。 書式が全然変わらないのです。 一応<head>内に、このようにしたのですが、やはり間違っているのでしょうか？ 　　　　↓ <link href="http://www.ＸＸＸＸＸ.com/ＣＳＳの名前.css" rel="stylesheet" type="text/css"> <style type="text/css"> htmlにお詳しい方、またはサイト制作にお詳しい方、お待ちしています。 宜しくお願いいたします。

  • 外部スタイルシートが無効になってしまう

    　ホームページビルダーにて外部スタイルシートを作り、文字の大きさを固定しました。 そして外部スタイルシートを任意のページにリンクし、文字に振りかけました。 プレビューで確認するとしっかり固定されているのですが、FTPで転送して そのページを見ると全く固定されていないのです。一体何が原因なのでしょうか? どうかお力を貸してください。よろしくお願い致します。

    • 締切済み
    • CSS
  • 外部ファイルでのスタイルシートの書き方

    質問内容は単純です。 どうぞ宜しくお願い致します。 あるweb関連の参考書に、 外部スタイルシートファイル「style.css」の一例として、 そのコード内容が書かれてあったのですが、 それを大雑把に説明すると下記のようになります。 <style type="text/css"> <!-- ～　中身は、ここでは省略　～ --> </style> そこで、質問です。 外部ファイルとしてスタイルシートを作成する場合、 上記のような書き方で、はたして良いのでしょうか？ 上記のような書き方は、HTMLのヘッダー内にスタイルシートを挿入する場合の書き方 のような気がするのですが、その書き方をそっくりそのまま、外部ファイルへ持って行っても、 問題はないのでしょうか？ 参考書が間違っているのかなぁ、と思い、 質問をさせて頂きました。 参考書は2005年発行のものです。

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する