喫茶XRAYトップページ

[スレッド全体]
[13292] スタイルシートの動きが変なんです返信　削除
2020/3/29 (日) 12:23:33 taki
マスター、皆さん
雑談ということでお許しを。

今、Webページのスタイルシートの記述で困っています。

test.html
------------------
<!doctype html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <link href="./css/test.css" rel="stylesheet" type="text/css">
  <title>test</title>
</head>
<!--  -->
<body>

<h1>見出し</h1>
<p>本文</p>

</body>
</html>
------------------

test.css
------------------
@charset "UTF-8"

h1 {color: green;}

p {color: green;}
------------------
このように記述した場合、「見出し」が緑色になりません。
以下のように書き換えると
------------------
@charset "UTF-8"

p {color: green;}

h1 {color: green;}
------------------
今度は「本文」が緑色になりません。
さらに、以下のように書き換えると
------------------
@charset "UTF-8"

.hoge{} /* 意味なし */

p {color: green;}

h1 {color: green;}
------------------
「見出し」「本文」共に緑色になります。

つまり、一番最初の命令（装飾）が無視されているようです。
これって私の環境だけの現象なのでしょうか。

Windows10 html,cssファイル共にTeraPadにて編集
確認したブラウザはIEとChrome(ツールに追加)

出歩いちゃいけない時期にスミマセン。

[13293] Re:スタイルシートの動きが変なんです返信　削除
2020/3/29 (日) 14:29:25 Mr.XRAY
▼ takiさん

> p {color: green;}

p は使用しない方がよろしいかと思いますが．
HTML の p は段落タグなので．
ただし，それが原因かどうかは不明でございます．あしからず．

> 出歩いちゃいけない時期にスミマセン。

まだ，戒厳令がでていないのでよろしいかと (笑)
それにしても買占めがスゴイようです．

[13295] Re2:スタイルシートの動きが変なんです返信　削除
2020/3/30 (月) 13:21:29 taki
▼ Mr.XRAYさん
> ▼ takiさん
>
> > p {color: green;}
>
> p は使用しない方がよろしいかと思いますが．
> HTML の p は段落タグなので．
> ただし，それが原因かどうかは不明でございます．あしからず．

きっとMSだからと思って、raspbian + nginx のローカルWebサーバーの
環境でためしてみたんですが、cssファイルの最初の命令は無視されますね。
どうしてなんだろ〜。

それと、Edgeは一度閉じないと変化は反映されないみたい。
通常はF5(再読み込み)で反映されるんじゃないの？
まったく、紛らわしい。

[13296] Re3:スタイルシートの動きが変なんです返信　削除
2020/3/30 (月) 14:38:31 Mr.XRAY
▼ takiさん

> 環境でためしてみたんですが、cssファイルの最初の命令は無視されますね。
> どうしてなんだろ〜。

以下でテストしてみました．

@charset "utf-8";
h1 {color: green;}
bbb {color: green;}

HTML のコードは以下です．

<!doctype html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <link href="./css/test.css" rel="stylesheet" type="text/css">
  <title>test</title>
</head>
<!--  -->
<body>

<h1>見出し</h1>
<bbb>本文</bbb>

</body>
</html>

ブラウザは以下です．IE 11 は色が変わらず黒でした．
何か文句あります ? (笑)
Chrome　バージョン: 80.0.3987.149（Official Build） （64 ビット）

http://mrxray.on.coocan.jp/Others/test.html


[13297] Re4:スタイルシートの動きが変なんです返信　削除
2020/3/30 (月) 15:28:18 taki
▼ Mr.XRAYさん
> ▼ takiさん
>
> > 環境でためしてみたんですが、cssファイルの最初の命令は無視されますね。
> > どうしてなんだろ〜。
>
> 以下でテストしてみました．
>
> @charset "utf-8";

>
> ブラウザは以下です．IE 11 は色が変わらず黒でした．
> 何か文句あります ? (笑)


原因が分かりました。
私のミスです。

@charset "UTF-8"  (誤)
@charset "UTF-8"; (正)

です。お騒がせしました。


[▼次のスレッド]
INCM/CMT
Cyclamen v3.82