- ベストアンサー
CSSを使って定型文を挿入できますか？
ページが増えてくると、あとから編集するときに大変になってきますよね。 例えばサイトのタイトルを変えたとき、 １ページずつタイトルを変更しようとすると面倒になります。 なので、<title></title>の間にＣＳＳか何かしらを使って定型文挿入する方法はありませんか？ これだとＣＳＳで変えるだけですべてのページで適用できますよね？ ところでＣＳＳを使う場合、ページ一つ一つでは文字とし検索に反映されますか？ というのも、フレームを使うと、ページの文字としてカウントされない弱点があってヒットが上がらない弱点があったりしますよね。
- oshietekun1go
- お礼率7% (2/27)
- CSS
- 回答数3
- ありがとう数0
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
＞特定ボックスをCSSで登録しておけば、それを配置したすべてのHTMLで ＞一括して扱える如く、同じ原理で商品名をCSSで登録しておけば、一括 ＞で全HTMLに適応できるみたいなものはないかなと思っているんです。 それは、繰り返しますが、ＳＳＩを使用するのが楽です。ご利用のサーバーでSSIは有効になっていると思いますので、次のようなファイルを用意して、test.shtmlというファイル名で保存します。簡単なのでHTML5で記述します。HTML4.01の場合は、それぞれを<div class="section">のように書き換えて、スタイルシートもdiv.sectionのように書き換える。 また、タグを含まないものでしたら、テキスト、画像、クォーテーションなどの簡単なものはスタイルシートのcontent:プロパティで加えることができます。 ★タブは＿に置換してあるので戻すこと。 <!doctype html> <head> ＿<meta charset="utf-8"> ＿<title>サンプル</title> <style media="screen"> <!-- body{counter-reset: section;} section h2:before{content: counter(section) "章: "; ＿counter-increment: section 1; } section h2:after{content:"--------\Aここから始まるよ";white-space:pre;font-size:0.8em;} --> </style> </head> <body> ＿<header> ＿＿<h1 id="title">Your title</h1> ＿＿<nav> <!--#include file="nav.htm" --> ＿＿</nav> ＿</header> ＿<section> ＿＿<h2>A smaller heading</h2> ＿＿<p> ＿＿</p> ＿</section> ＿<section> ＿＿<h2>A smaller heading</h2> ＿＿<p> ＿＿</p> ＿</section> ＿<footer> ＿＿<h3>A nice footer</h3> ＿</footer> </body> </html> 別途、nav.htmを用意します。 ＿＿＿<ul> ＿＿＿＿<li><a href="#">Some</a></li> ＿＿＿＿<li><a href="#">navigation</a></li> ＿＿＿＿<li><a href="#">links</a></li> ＿＿＿</ul> そして、サーバー上(ファイルじゃない)でtest.shtmlを開くと、nav.htmlの内容が追加されて表示されます。 ★htmlの拡張子でSSIを動作させるためには.htaccessの編集が必要です。
その他の回答 (2)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
ちょっと待ってください。 titleは、 【引用】HTML4.01＿＿＿＿＿＿＿＿＿＿＿＿ここから 著者は、当該文書の内容を識別するためにTITLE 要素を用いる必要がある。 ユーザは文脈抜きで文書を参照することがあるため、著者は文脈を踏まえたタイトルを提供する必要がある。 つまり、著者は、「概説」などの文脈不明なタイトルではなく、「中世の養蜂についての概説」のようなタイトルを提供しなければならない。 ￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［The global structure of an HTML document (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#edef-TITLE )］より 【引用】HTML5＿＿＿＿＿＿＿＿＿＿＿＿ここから The title element represents the document's title or name. Authors should use titles that identify their documents even when they are used out of context, for example in a user's history or bookmarks, or in search results. The document's title is often different from its first heading, since the first heading does not have to stand alone when taken out of context. ￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［4 The elements of HTML — HTML5( http://www.w3.org/TR/2011/WD-html5-20110525/semantics.html#the-title-element )］より 言い換えれば、それぞれのページに個別のtitleを付けるべきで、しかもそれはtitleだけ読んで内容が推測できる適切なものでなければなりません。 CSSは、HTMLがこの様に文書構造を記述するものであり、titleがHTMLの要素であるのです。ブラウザはスタイルシートを読む前にtitleをタイトルバーに表示します。CSSでは変更できないことを意味しています。 あなたがgoogleなどで検索した結果を元にそのリンク先に進むのは、そのタイトルを見ているはずです。 それはともかく、ページの一部の要素が、複数のページで同一の場合は、単純にSSIを使うほうが良いでしょう。 たとえば [HTML4.01] <body> <div class="header"> <div class="hgroup"> <h1>サイトの見出し★</h1> <h2>このページの見出し</h2> </div> <div class="nav"> ナビゲーション★ </div> </div> ・・・【中略】・・・ [HTML5] <body> <header> <hgroup> <h1>サイトの見出し★</h1> <h2>このページの見出し</h2> </hgroup> <nav> ナビゲーション★ </nav> </header> ・・・【中略】・・・ というHTMLの場合 [HTML4.01] <body> <div class="header"> <div class="hgroup"> <!--#include file="ssi/h1.htm" --> <h2>このページの見出し</h2> </div> <div class="nav"> <!--#include file="ssi/nav.htm" --> </div> </div> ・・・【中略】・・・ [HTML5] <body> <header> <hgroup> <!--#include file="ssi/h1.htm" --> <h2>このページの見出し</h2> </hgroup> <nav> <!--#include file="ssi/nav.htm" --> </nav> </header> ・・・【中略】・・・ としておけば、それらは共通化されます。 ※ HTMLがSSIとして動作するように.htaccessで指定しておく。 なお、titleはこの場合<h2>内容と同じものにしておきます。ページの見出し(heading)とtitleは同じものである必要はありませんが、titleは内容と一致するものでなければなりません。
- t_ohta
- ベストアンサー率38% (5238/13705)
CSSは文字色や背景色、大きさ、位置といった装飾を定義する物であって、コンテンツを変更するための物ではありません。 CGIやSSI、JavaScriptを使用して書き換えましょう。
補足
なるほど ちなみにそのCGIなりSSIなりJAVAscriptなりを使った方法を教えていただけないでしょうか。。。 いまほんとに切実な状況です。
補足
いやはや、初耳の言葉だらけで難しいですね・・・。だけどここで諦めるわけにはいきません。 確かにタイトルに関してはおっしゃるとおり。 私の例えが悪かったです。 実はタイトルでなくともなんでもよく、特定ボックスをCSSで登録しておけば、それを配置したすべてのHTMLで一括して扱える如く、同じ原理で商品名をCSSで登録しておけば、一括で全HTMLに適応できるみたいなものはないかなと思っているんです。 そうすると商品名などを全ページにわたって一つ一つ変更する作業を効率良く行えるので。 もちろんその場合、CSSはではなくほかの何かを必要があるというところまではt_ohtaさんの説明からも理解致しました。