掲示板/スタイルシート質問板/過去ログ/一覧/ 外部スタイルシートについて

0 名前：なお： 2006/11/26（日） 22:41 ID:Azc7Go/r: スタイルシートをまずページ内に書き込み、後から外部へと設定したのですがスタイルシートが呼び出されません。
ちゃんと呼び出されるようにしたいのですが、原因が分かりません。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style type=text/css>

</style>
</head>

↑のスタイルシートを外部で保存し、呼び出しタグを入れたのですが、なぜか呼び出されずにレイアウトが崩れてしまいます。
よろしければご回答下さい。

1 名前： Newのり太 ： 2006/11/26（日） 22:41 ID:YkIsWNSi: 実物（ページURL）を提示されればどのたかが検証してくれるかもしれません。

2 名前：匿名： 2006/11/26（日） 22:41 ID:eSgnLOHq: 外部スタイルシートにタグなどは書いてはいけませんよ。
http://www.tagindex.com/stylesheet/basic/pattern1.html

3 名前：なお： 2006/11/26（日） 22:41 ID:Azc7Go/r

サーバーアップをしていないので、とりあえず全部のソースを載せさせていただきます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML lang="ja">
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META NAME="GOOGLEBOT" CONTENT="NOINDEX, NOFOLLOW">
<META NAME="ROBOTS" CONTENT="NOARCHIVE,NOINDEX,NOFOLLOW">
<META name="robots" content="noindex,nofollow">
<title></title>
<style type=text/css>
<!-- body,td{color:#999999;
font:9pt/15pt Vardana,Osaka; line-height:1.2em;}
a:link{color:#99ccff;text-decoration:none;cursor:default;}
a:active{color:#6699cc;text-decoration:none;}
a:visited{color:#99ccff;text-decoration:none;}
a:hover{color:#6699cc;text-decoration:none;position:relative;top:1px;left:1px;}
strict {line-break: strict} 
body{scrollbar-3dlight-color:#ffffff;
 scrollbar-arrow-color:#999999; 
 scrollbar-darkshadow-color:#ffffff;
 scrollbar-face-color:#ffffff; 
 scrollbar-highlight-color:#ffffff;
 scrollbar-shadow-color:#ffffff; 
cursor:default;
margin:0px;}
span{font-size:11px;border:1px  #ffffff;
　　　height:45px;width:230px;padding:7px;
　　　overflow:auto;
 scrollbar-3dlight-color:#ffffff;
 scrollbar-arrow-color:#999999; 
 scrollbar-darkshadow-color:#ffffff;
 scrollbar-face-color:#ffffff; 
 scrollbar-highlight-color:#ffffff;
 scrollbar-shadow-color:#ffffff; 
}

table.ta1{width:100%;height:100%;border:none;}
table.ta2{width:100%;height:450px;border:none;}
td.td1{width:400px;height:100%;border:none;background : #ffffff url(accessories/background/contents_1.jpg) no-repeat 10% 70%;}
iframe.frame{width:100%;height:410px;}
div.menu{padding:150px 0px 0px 50px;border:none;}
div.menu2{padding:15px 0px 0px 0px;border:none;}
div.menu3{padding:40px 0px 0px 0px;border:none;}
div.ti{color:#ffaa99;font:bold 14pt Vardana,Osaka;}
-->
</style>
<BASE target="main">
</head>
<body>
<table class=ta1 cellpadding=0 cellspacing=0>
　<TR>
      <TD align="center">
<table class=ta2 cellpadding=0 cellspacing=0>
          <TR>
            <TD class="td1" valign="top" colspan="4" height="176">
            <DIV class="menu" align="center"><B><FONT size="+1" face="ＭＳ Ｐゴシック">AAAAAAA</FONT></B><BR>
            since11.5.2006</DIV>
            </TD>
            <TD rowspan="4"><div style="padding:4px 5px;border-color:#cccccc;border-width:0 0 1px 0;border-style:solid;"><FORM action="http://form3.future-s.com/cgi/form3.cgi" method="post"style="margin:1px;">　　　NEXT≫1000　　　　　　　　　One　word <input type="hidden" name="formid" value="061006007100"><input type="hidden" name="formsubject" value="ONEWORD"><input type="hidden" name="formlog" value="1"><input type="hidden" name="formreq" value="メッセージ"><input type="text" name="メッセージ" size="42" maxlength="100" id="message"style="border:solid 1px #999999;color:#999999;background-color:#FFFFFF">
<input type="submit" value="write"style="border:solid 1px #999999;color:#999999;background-color:#FFFFFF;"></FORM></div>
      <IFRAME src="first.html" class="frame" scrolling="auto" frameborder="0" name="main" framespacing="0" width="565"></IFRAME>
            　　<div style="padding:4px 5px;border-color:#cccccc;border-width:1px 0 0 0;border-style:solid;"><A href="about_site.html" target="_blank">≫About　this　site</A>　　　<A href="index.html" target="_self">≫Back　to　TOP</A></div></TD>
          </TR>
          <TR>
            <TD colspan="4" height="26"><DIV class="menu2" align="center"><A href="precious.html"target="main">Precious</A>　　<A href="frame.html"target="main">Novel</A>　　<A href="http://straymoon.blog53.fc2.com/"target="_blank">Blog SS</A>　　<A href="http://setsurenka.jugem.jp/"target="main">Diary</A>　　<A href="http://www.21styles.com/mydiary/straydog/"target="main">Reply</A>　　<A href="http://bbs11.fc2.com/php/e.php/setsurenka/"target="main">Traces</A>　　<A href="link.html">Link</A>　　<A href="mail.html">Mail</A></DIV></TD>
          </TR>
          <TR>
            <TD rowspan="2" width="30">　　</TD>
            <TD width="240" valign="bottom"><DIV class="menu3">what's　new?</DIV></TD>
            <TD valign="bottom"><DIV class="menu3">web　clap</DIV></TD>
            <TD rowspan="2" width="78">
            <DIV class="menu3">　<a href="http://webclap.simplecgi.com/clap.php?id=straymoon" target="_blank"><IMG src="accessories/sanzo.gif" width="30" height="45" border="0"></a></DIV>
            　<FONT size="-2">ぽちっと</FONT></TD>
          </TR>
          <TR>
            <TD valign="top" width="240"><SPAN><FONT color="#99ccff"><B>2006.11.21 update!</B></FONT>　Novel up！<BR>
            <FONT color="#99ccff"><B>2006.11.14 update!</B></FONT>　Precious&amp;Novel up！<BR>
            <FONT color="#99ccff"><B>2006.11.13 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.12 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.10 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.10 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.9 update!</B></FONT>　　<BR>
            <FONT color="#99ccff"><B>2006.11.6 update!</B></FONT>　　<BR>
            <FONT color="#99ccff"><B>2006.11.5 update!</B></FONT>　　<BR>
            <FONT color="#99ccff"><B>2006.11.5 update!</B></FONT>　　<BR>
            </SPAN></TD>
            <TD valign="top" width="73"><FONT size="-2">よろしければ<BR>
            励みになります。</FONT></TD>
          </TR>
        </table>
      </TD>
    </TR></table>
</body></html>

外部で保存するしたときはスタイルシートの部分しか記述していません。

4 名前：匿名： 2006/11/26（日） 22:41 ID:agFEGxK5: 外部cssにした時に上手くいかないんだったら、その外部cssファイルと読み込みの部分を書かないと。

5 名前：なお： 2006/11/26（日） 22:41 ID:Azc7Go/r

上記に書いたスタイルシートの部分をそのまま外部として保存しています。

下記スタイルシート部分をcontents.cssで保存。

body,td{color:#999999;
font:9pt/15pt Vardana,Osaka; line-height:1.2em;}
a:link{color:#99ccff;text-decoration:none;cursor:default;}
a:active{color:#6699cc;text-decoration:none;}
a:visited{color:#99ccff;text-decoration:none;}
a:hover{color:#6699cc;text-decoration:none;position:relative;top:1px;left:1px;}
strict {line-break: strict} 
body{scrollbar-3dlight-color:#ffffff;
 scrollbar-arrow-color:#999999; 
 scrollbar-darkshadow-color:#ffffff;
 scrollbar-face-color:#ffffff; 
 scrollbar-highlight-color:#ffffff;
 scrollbar-shadow-color:#ffffff; 
cursor:default;
margin:0px;}
span{font-size:11px;border:1px  #ffffff;
　　　height:45px;width:230px;padding:7px;
　　　overflow:auto;
 scrollbar-3dlight-color:#ffffff;
 scrollbar-arrow-color:#999999; 
 scrollbar-darkshadow-color:#ffffff;
 scrollbar-face-color:#ffffff; 
 scrollbar-highlight-color:#ffffff;
 scrollbar-shadow-color:#ffffff; 
}

table.ta1{width:100%;height:100%;border:none;}
table.ta2{width:100%;height:450px;border:none;}
td.td1{width:400px;height:100%;border:none;background : #ffffff url(accessories/background/contents_1.jpg) no-repeat 10% 70%;}
iframe.frame{width:100%;height:410px;}
div.menu{padding:150px 0px 0px 50px;border:none;}
div.menu2{padding:15px 0px 0px 0px;border:none;}
div.menu3{padding:40px 0px 0px 0px;border:none;}
div.ti{color:#ffaa99;font:bold 14pt Vardana,Osaka;}

下記がHTMLです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML lang="ja">
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META NAME="GOOGLEBOT" CONTENT="NOINDEX, NOFOLLOW">
<META NAME="ROBOTS" CONTENT="NOARCHIVE,NOINDEX,NOFOLLOW">
<META name="robots" content="noindex,nofollow">
<title></title>
<LINK rel="stylesheet" type="text/css" href="contents.css">
<BASE target="main">
</head>
<body>
<table class=ta1 cellpadding=0 cellspacing=0>
　<TR>
      <TD align="center">
<table class=ta2 cellpadding=0 cellspacing=0>
          <TR>
            <TD class="td1" valign="top" colspan="4" height="176">
            <DIV class="menu" align="center"><B><FONT size="+1" face="ＭＳ Ｐゴシック">AAAAAAA</FONT></B><BR>
            since11.5.2006</DIV>
            </TD>
            <TD rowspan="4"><div style="padding:4px 5px;border-color:#cccccc;border-width:0 0 1px 0;border-style:solid;"><FORM action="http://form3.future-s.com/cgi/form3.cgi" method="post"style="margin:1px;">　　　NEXT≫1000　　　　　　　　　One　word <input type="hidden" name="formid" value="061006007100"><input type="hidden" name="formsubject" value="ONEWORD"><input type="hidden" name="formlog" value="1"><input type="hidden" name="formreq" value="メッセージ"><input type="text" name="メッセージ" size="42" maxlength="100" id="message"style="border:solid 1px #999999;color:#999999;background-color:#FFFFFF">
<input type="submit" value="write"style="border:solid 1px #999999;color:#999999;background-color:#FFFFFF;"></FORM></div>
      <IFRAME src="first.html" class="frame" scrolling="auto" frameborder="0" name="main" framespacing="0" width="565"></IFRAME>
            　　<div style="padding:4px 5px;border-color:#cccccc;border-width:1px 0 0 0;border-style:solid;"><A href="about_site.html" target="_blank">≫About　this　site</A>　　　<A href="index.html" target="_self">≫Back　to　TOP</A></div></TD>
          </TR>
          <TR>
            <TD colspan="4" height="26"><DIV class="menu2" align="center"><A href="precious.html"target="main">Precious</A>　　<A href="frame.html"target="main">Novel</A>　　<A href="http://straymoon.blog53.fc2.com/"target="_blank">Blog SS</A>　　<A href="http://setsurenka.jugem.jp/"target="main">Diary</A>　　<A href="http://www.21styles.com/mydiary/straydog/"target="main">Reply</A>　　<A href="http://bbs11.fc2.com/php/e.php/setsurenka/"target="main">Traces</A>　　<A href="link.html">Link</A>　　<A href="mail.html">Mail</A></DIV></TD>
          </TR>
          <TR>
            <TD rowspan="2" width="30">　　</TD>
            <TD width="240" valign="bottom"><DIV class="menu3">what's　new?</DIV></TD>
            <TD valign="bottom"><DIV class="menu3">web　clap</DIV></TD>
            <TD rowspan="2" width="78">
            <DIV class="menu3">　<a href="http://webclap.simplecgi.com/clap.php?id=straymoon" target="_blank"><IMG src="accessories/sanzo.gif" width="30" height="45" border="0"></a></DIV>
            　<FONT size="-2">ぽちっと</FONT></TD>
          </TR>
          <TR>
            <TD valign="top" width="240"><SPAN><FONT color="#99ccff"><B>2006.11.21 update!</B></FONT>　Novel up！<BR>
            <FONT color="#99ccff"><B>2006.11.14 update!</B></FONT>　Precious&amp;Novel up！<BR>
            <FONT color="#99ccff"><B>2006.11.13 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.12 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.10 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.10 update!</B></FONT>　<BR>
            <FONT color="#99ccff"><B>2006.11.9 update!</B></FONT>　　<BR>
            <FONT color="#99ccff"><B>2006.11.6 update!</B></FONT>　　<BR>
            <FONT color="#99ccff"><B>2006.11.5 update!</B></FONT>　　<BR>
            <FONT color="#99ccff"><B>2006.11.5 update!</B></FONT>　　<BR>
            </SPAN></TD>
            <TD valign="top" width="73"><FONT size="-2">よろしければ<BR>
            励みになります。</FONT></TD>
          </TR>
        </table>
      </TD>
    </TR></table>
</body></html>

6 名前：なお： 2006/11/26（日） 22:41 ID:Azc7Go/r: すみません。
色々とソースを整理したら、きちんとスタイルシートを呼び出せました。
ご意見、ありがとう御座いました。