HPに適用されるテンプレートファイルの階層とリンクの色変更方法について

前へ 次へ
このQ&Aのポイント
  • イラスト・小説のHPを作っている方がテンプレートをダウンロードしました。今回の質問は、テンプレートのCSSを他のフォルダにも適用する方法と、リンクの色変更方法についてです。
  • ダウンロードしたテンプレートのフォルダ階層は、スタイルシートと本体ファイルが一つのフォルダに入っており、画像フォルダも別に存在します。質問者のHPのフォルダ階層は、画像フォルダと作品フォルダ、スタイルシートの本体ファイルが存在しています。
  • リンクの色変更方法については、リンクを表すaタグに対してCSSのcolorプロパティを利用して色を変更することができます。また、テンプレートのCSSを他のフォルダに適用するには、HTMLのhead要素内でリンクタグを使用して外部のCSSファイルを読み込むようにします。
回答を見る
  • ベストアンサー

HPに適用されるテンプレートファイルの階層について

はじめまして。 イラスト・小説のHPを作っていて、この度フリー素材サイト様からテンプレートをダウンロードしました。 HTMLやCSSは独学でポチポチうつくらいの知識度です。 今回教えて欲しいのは二つです。 ・下記の方法でやった所リンクの色は変わり繋がったように見えて実際は貼れていなかったのでリンクをつなぎたい。 ・そもそもスタイルシートを違う階層にも適応するにはどのようにすればいいのか教えて欲しい。(そうでなければいちいちスタイルシートをコピーしなければならなくて乱雑になってしまうので) ◆現在の状況 その素材サイトさんの素材ではカスタマイズについてはOKです。 「ファイルとCSSの階層は同じ場所に」 と、書いてあったのですが、作品管理のためにフォルダを分けています。 それで、DLしたファイルのCSSを別フォルダの中にも適用するにはどうすればいいでしょうか? ◆現在のフォルダ ダウンロードしたフォルダの中身 ↓ ・スタイルシートのファイルとmain.html等の本体 ・imageというテンプレートの画像フォルダ 私のHPフォルダはこういう階層になってます ↓ ・image……DLした画像フォルダ ・illast……作品 　　　　　　　作品ファイル達です。(a.html・b.html) ・CSS……DLしたスタイルシート・本体 　 main.html 上記の中でフォルダなのはillast、imageの二つで後ファイルが生で入ってます。 やりたかったのはmain.htmlにa.htmlのリンクを貼りたかったので下記のように記述しました。 <a href="illust/a.html" target="FRAME_MAIN" title="注意書き">作品a</a> です。ちなみにtarge～ttitleの記述は元のソースからそのままコピーして使いました。 よろしくお願いします。ご回答お待ちしてます。

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

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

  • ベストアンサー
noname#158634
noname#158634
回答No.1

＞・下記の方法でやった所リンクの色は変わり繋がったように見えて実際は貼れていなかったのでリンクをつなぎたい。 ＞・そもそもスタイルシートを違う階層にも適応するにはどのようにすればいいのか教えて欲しい。(そうでなければいちいちスタイルシートをコピーしなければならなくて乱雑になってしまうので) 質問はふたつですが答えは一つです。 https://www.google.com/search?q=%E3%83%AA%E3%83%B3%E3%82%AF+%E3%83%91%E3%82%B9 https://www.google.com/search?q=%E7%B5%B6%E5%AF%BE%E3%83%91%E3%82%B9+%E7%9B%B8%E5%AF%BE%E3%83%91%E3%82%B9 HTMLファイルの中で<img>タグを使用して画像を表示させたり、自分で書いたHTMLファイルにCSSを適用させたりはできているのでしょう？ならそれと同じようにすればいいんです。パスについての知識さえつければ解決する問題です。 ちなみに。 念のため確認しますが、main.htmlはフレームですよね…？？ ＞<a href="illust/a.html" target="FRAME_MAIN" title="注意書き">作品a</a> これはどう見てもフレーム分割されたページの記述ですが。

happycat-kotori
質問者

お礼

長らくお返事を返せず申し訳ありません。 それから回答の方、ありがとうございました。 参考URL大変勉強になりました。 サイト改装の方もうまくいったので大満足です＾＾ ありがとうございました。

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

関連するQ&A

  • [Dreamweaver8]テンプレートに外部CSSを適用→HTMLドキュメントにCSSが適用されないのは何故？

    Dreamweaver8初心者で、現在勉強中の者です。 Dreamweaverのテンプレート機能を使った、外部CSSの設定方法についてお尋ねします。 ディレクトリは現在、以下のような状態です。 [サイト -SampleWebSiteFolder-] 　　　｜―[Templates] 　　　｜　　　｜―[style.css] 　　　｜　　　 Ｌ―[template.dwt] 　　　｜ 　　 　Ｌ[index.html] ※拡張子の無いものはフォルダを表します。 index.htmlファイルへCSSを適用させたいのですが、適用されないで困っています。 cssは、外部スタイルシートファイルを用意(style.css)し、テンプレート(template.dwt)に対して、CSSスタイルパネルの[スタイルシートを添付]ボタンより設定しています。 結果、テンプレート(template.dwt)に対してはCSSが適用されるのですが、HTMLドキュメント(index.html)にはCSSが適用されていない状態です。 テンプレートを用いて外部スタイルシートにてサイトを管理する場合、上記のケースにおける問題の原因は何でしょうか。 ちなみに、テンプレート[template.dwt]及び、HTMLドキュメント[index.html]の<head></head>内には、以下のソースが記述されています。 <link href="style.css" rel="stylesheet" type="text/css" />

  • ＦＣ２ＨＰサービスでのファイルマネージャーについて

    ローカルでＨＰが出来上がりＦＣ２のサーバー（ファイルマネージャー）でアップを試みたのですが、いろいろなＱ&Ａを検索しても理解できずに困っています。 ローカルではhomepegeフォルダの中にindex.htmlとimageフォルダとcss.cssのカスケードスタイルシートの３つが存在します。 imageフォルダにはＨＰで使用する画像がgifで保存してあります。 これをＦＣ２の管理画面からroot階層にindex.htmlを上書きし（最初から用意されているので）同じroot階層にcss.cssをアップ、更に同rootにimageと名前を付けたディレクトリを新しく作成しました。 ですのでrootには既存のiフォルダも入れて３つのフォルダと１つのcssとなります。 imageフォルダを選択するとimageディレクトリの画面になりそこにimageファイルの中の画像をアップしました 結果はcssも画像も反映しておりません（ＨＴＭＬで記述した箇所だけ反映されています） ファイルマネージャーの使い方が善く理解できていないのと恐らくは階層が違うと思うのですが cssとimageの中の画像はどの階層にアップしたらよいのでしょうか？ ローカルではブラウザで確認しましても問題無く完成しております 御教授宜しくお願い致します。

  • CSSをある程度深い階層に位置するフォルダ内にあるhtmlファイルに適用させるには、どのような記述をすればいいですか。

    Ａフォルダ内に ＣＳＳフォルダがあり、そのフォルダ内にＣＳＳファイルがあります。 また、Ａフォルダ内には他にも Ｂフォルダがあり、そのＢフォルダ内にいくつかのhtmlファイルとＣフォルダを入れてあります。 そのＣフォルダ内にもhtmlファイルがあります。 このＣフォルダ内のhtmlファイルにＣＳＳが適用されないのです。他のhtmlファイルには適用されるような記述をしています。 Ｃフォルダ内のhtmlファイルには、どのように記述したらＣＳＳが適用されますか。 ちなみに、Ｂフォルダ内のいくつかのhtmlファイルを作成した時のメモ帳には、 <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <link rel="stylesheet" href="../css/mystyle.css" type="text/css" /> と記述しました。

    • ベストアンサー
    • HTML
  • ワードプレスへのテンプレートの設定

    「 テーマに style.css スタイルシートにありません。テーマのインストールに失敗しました。」 というエラーが出ました。 テンプレートキングからのダウンロードでＺＩＰファイル名は「ＦＳＶ００１ＷＰ０２０」です 調べた結果 原因 ・ダウンロードしたＺｉｐファイルに、テンプレート本体でない、マニュアルや見本画像などのファイルが含まれている可能性がある 対応 ・ＺＩＰファイルを解凍 ・テンプレート本体のＺｉｐファイルのみをインストール ということがわかりました。 そこでＦＳＶ００１ＷＰ０２０.zipを展開しました。 再度、新規追加→テーマのアップロードを試みました。 今度は展開したＦＳＶ００１ＷＰ０２０（１階層目）を開きました。 すると ２階層目：「２列右メニュー」を開きました。他マニュアルとフォルダが２つ ３階層目：「themes」を開きました ４階層目：「confeit_wt」を開きました ５階層目：「Image」フォルダと、あとなにやらｐｈｐファイルがたくさんあります。 ６階層目：なにやらまたファイルがたくさんあります。 わたしが調べた情報だと、さいしょのＦＳＶ００１ＷＰ０２０を展開したら、マニュアルや見本画像の他に、テンプレート本体のＺＩＰファイルがあって、それをインストールすればいいはずなのに、どうもそういう構造になっていないようです。 なので、最初のＦＳＶ００１ＷＰ０２０を展開した結果から、マニュアルなどを取り除いて、 残ったものを（たぶんテンプレート本体だろう）と再度ＺＩＰ形式にして、それをインストール試みたのですが、これも「テーマに style.css スタイルシートにありません。テーマのインストールに失敗しました。」と出てきます。 テンプレートは、テンプレートキングというサイトのカメレオンなんちゃらです。 サイトに問い合わせをしたいのですが、問合せ先が不明だったので、こちらで質問させていただきました。 わかるかた、いらっしゃいますでしょうか どうしたらインストールできるのでしょうか、どれをインストールすればいいのでしょうか

  • 階層の違うディレクトリでのCSSの呼び出し方

    現在FC2さんにサーバーをお借りしてPCサイトをつくっているものです。 HIMEISM（http://neo-himeism.net/）さんに疑似フレームのテンプレートをお借りして、半分以上はうまくいっているのですが、中身が増えてきたので小説と漫画とイラストをそれぞれ、indexなどより一つ下の階層に分けようとしたのですが、そうすると<link rel="stylesheet" type="text/css" href="img/style.css">としているにも関わらずCSSスタイルシートが呼び出されません。 今は何のディレクトリにも入っていないindexやlink、offなどが一番上の階層にあり、一つ下にスタイルシートやアイコンなどに使う画像が入れられた最初から入っていたimgのディレクトリ、小説、漫画、イラストそれぞれのディレクトリがある状態です。 img以外全部、何のディレクトリにも入れなければ正常に反映されます。 階層を分けたまま、すべてにテンプレートが反映されるようにしたいのですが、どうすればいいでしょうか。

  • ワードプレスのテンプレートインストール

    「テーマに style.css スタイルシートにありません。」というエラーがでてきました。 そこで、テンプレートのＺｉｐファイルを展開して、テンプレート本体のみをインストールしようとしたのですが、そこでつまずきました。 どれがテンプレートの本体なのかがわかりません。 階層は FSV001うんちゃらかんちゃら 　　↓ ２列右メニュー 　　↓ themes 　　↓ confeito_wt ↓ 「Imgフォルダ」とあとなんだか、phpファイルがたくさんある で、最後のimgフォルダとたくさんあるphpを全部一括選択して「開く」をすればいいのかと思えば、なんかファイル1個１個個別にしないとできないみたいで・・・ （そもそもそのやりかたでいいのかどうかも） ワードプレスのテンプレートインストールってどのようにしたらいいのでしょうか

  • dreamweaverのテンプレートでリンクが上手く貼れない

    dreamweaverのテンプレートを利用しているサイトを引き継ぎました。 下記のようなフォルダ階層です。 index.html aaa/index.html bbb/index.html bbb/ccc/index.html bbb/ccc/ddd/index.html Templates/main.dwt 新たに bbb/ccc/eee/index.html を作成し、リンクを追加したいのですが、 Templates/main.dwtにある記述 <a href="../ccc/ddd/index.html"> をコピーして追加して新たに <a href="../ccc/eee/index.html"> を加えてリンクしました。 すると、すべてのhtmlがTemplates/main.dwtをテンプレートとして作成されているために、リンクが上手く貼れません。 bbb/ccc/ddd/index.html と同じ階層にあるhtmlはこれでよいのですが、 bbb/ccc/index.html と同じ階層にあるhtmlはリンク先が違ってしまいます。 階層によってリンクを変える方法があるのでしょうか？ とりあえず現在のところは該当フォルダ内のhtmlに対して置換を行っているのですが、回り道な作業をしているような気がしてなりません。 テンプレにはTemplates/main.dwtしかないので、そのdwt一枚で更新していたのだと思うのですが、設定で階層ごとにリンクパスを自動に変える方法などがあるのでしょうか？ ご存じの方、よろしくお願いいたします。 環境： windows XP dreamweaver 8

  • JavaScriptで、参照する階層を変えるとCSSが読み込めない

    　ランダムに1.cssまたは2.cssというcssファイルを読み込むスクリプトを記述しています。 <script language="javascript"> <!-- var cssno = Math.floor(Math.random() * 2 + 1); document.write("<link rel='stylesheet' type='text/css' href='"+cssno+".css'>"); //--> </script> 　これでうまく動いたので、このスクリプトを含むHTMLファイルがある階層に「css」というフォルダを作り、その中にcssファイルを移しました。そこで、 <script language="javascript"> <!-- var cssno = Math.floor(Math.random() * 2 + 1); document.write("<link rel='stylesheet' type='text/css' href='css/"+cssno+".css'>"); //--> </script> というふうに、変数cssnoの前に階層を表す「css/」をつけたのですが、これをやったとたんに動かなくなりました。 　ファイルを同じ階層に移動させて、「css/」を取れば（＝元の状態に戻せば）動きます。参照する階層を間違えているのかと思って、<head></head>内に通常通り<link rel～>でCSSを指定したら読み込めました。 　スクリプトの記述方法がいけないんでしょうか？　どうすれば、フォルダ「css」からcssファイルを読み込めるようになりますか？

  • CSSで相対パス

    さっきニコニコ動画のスタイルシート見たんですけど、 こういう記述があって body.tpl { width:960px; background:#FFF url('/img/tpl/bg_rc2.gif') repeat-x; color:#333; margin:0px auto; padding:0px; } このスタイルシートはcssというフォルダの中にあって、 そこと同じ階層にimgというフォルダがあって、 あとは直接index.phpとかのメインのファイルが置いてあるみたいなんですけど、 普通外部スタイルシートから別のフォルダ(同じ階層にある別のフォルダ)にあるイメージを呼び出すなら ../img/tpl/bg_rc2.gif になるはずだと思うんですけど、上の記述だとまるでCSSの相対パスのベースが上位の階層(index.phpとかのメインのファイルがあるの階層)になってるみたいにに見えるんですよね、 もしこれが出来るなら、大量にネストして外部スタイルシート作ってある場合(imgフォルダから遠い階層)、 ../../../../../../img/a.gif って呼び出さないといけないのが楽にすむじゃないですか、 もし外部スタイルシートの相対パスのベースをこういう風に設定できる方法があるならおしえて下さい、 俺の勘違いだったらごめんなさい

    • ベストアンサー
    • HTML
  • ＨＰの2ページ目の作り方

    初めて利用させていただきます、ＷＥＢ初心者ですがよろしくお願いします。 現在ホームページをホームページビルダーで作成しています。 テンプレートができたのですが次のページの増設をどのように行なうのが良いのか分からずに困っています。 ディレクトリの構成はルートフォルダの下に index.html（まだ、コンテンツは作っておらず、段組の状態です）＝cssフォルダ＝imageフォルダ＝pageフォルダ というように３つのフォルダ+インデックスhtmlで分けています。 各フォルダにはcssとimageが入っていて、現在ｐａｇｅフォルダが空の状態です。 この状態でインデックス（テンプレート）を作り終えたところです。 ページフォルダにテンプレートを使って新しいページを増やしていきたいのですが、 この場合ｐａｇｅフォルダにインデックスhtml（テンプレート）をコピペするとｈｔｍｌとｃｓｓの画像やリンクのＵＲＬを全て書き換えなければならないのでしょうか。 まず、ディレクトリ構成として正しいのか、正しいのであればどのように増設していくのが効率が良いのか、それとも階層が変わるたびに全ての画像やリンクのＵＲＬを書き換えてやっていくしかないのか。 どなたか詳しい方、ご教授お願い致します。

    • ベストアンサー
    • CSS

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する