質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.37%

CSSファイルに番号がついているのはなぜ?

解決済

回答 4

投稿

  • 評価
  • クリップ 0
  • VIEW 1,085

LanHma

score 192

いつもお世話になっております。助かっております。

あるサイトにてCSSのファイル名が

style.css?20150507
style.css?146250284

となっておりました。他のサイトでも良く見かける機会が多いです。
ここで三点質問をさせて下さい。

1: そもそもこのCSSは何なのか。

2: .css?20150507という拡張子でなぜ読み込めているのか

3: このcssはsassか何かで吐き出しているのでしょうか?

お手数をお掛けしますがご教授のほど宜しくお願いいたします。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 4

checkベストアンサー

+2

?以降は、強制的にキャッシュをクリアさせるために付いているものです。

  1. ほとんどの場合、ただのCSSファイルです。
  2. HTTPアクセスの場合、?以降はクエリとして処理されます。CSSファイルがクエリによって変化することは通常ないので、?以前のファイル内容がそのまま返されます。
  3. Sassなどで生成しても、手書きのCSSを置いておいても構いません。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/27 16:08

    総合1位の皆様に答えていただき光栄です!
    理解できました!
    ありがとうございます!

    キャンセル

+1

1: そもそもこのCSSは何なのか。

style.css という普通のCSSファイルです。
それに対しパラメータ(?以降)を付与して呼び出しています。

2: .css?20150507という拡張子でなぜ読み込めているのか

上述のとおり、拡張子は .css で、それ以降はパラメータです。

3: このcssはsassか何かで吐き出しているのでしょうか?

それはケースバイケースです。
パラメータ部分は手打ちで書く場合も、PHPなどで動的に生成する場合もあります。


上記の質問で足りていない、そもそも何をやっているかですが、パラメータには意味がないことが多いです。

CSSの内容を更新した際に、ブラウザなどがキャッシュしているCSSを確実に新しい物に再読み込みさせるために、パラメータを変えて別のファイルと認識させ読み込ませる、ということをよくやります。
そのためパラメータには更新日時やCSSファイル自身のMD5ハッシュなどを使うことが多いです。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/27 16:09

    総合1位の皆様に答えていただき光栄です!
    理解できました!
    ありがとうございます!

    キャンセル

+1

1: そもそもこのCSSは何なのか。

質問の内容が不明ですが、何が書かれているかによると思います。

2: .css?20150507という拡張子でなぜ読み込めているのか

拡張子は.cssです。?20150507はクエリ文字列です。
そもそも、HTTP通信において拡張子は必須のものではありません。サーバが拡張子を解釈してMIMEタイプを指定しているので、スクラッチでそういうものを書けば問題なく動くはずです。

3: このcssはsassか何かで吐き出しているのでしょうか? 

かもしれません。ブラウザキャッシュ対策だと思います。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/27 16:09

    総合1位の皆様に答えていただき光栄です!
    理解できました!
    ありがとうございます!

    キャンセル

+1

参考URL

CSS等の静的なファイルはブラウザやプロキシによってキャッシュされてしまい、
更新してもすぐに最新のものが反映され無いことがあります。
これを防ぐための方法としてご質問の方法が使われています。

それぞれの回答としては

1: そもそもこのCSSは何なのか。

普通のCSSです。

2: .css?20150507という拡張子でなぜ読み込めているのか

拡張子の後ろに?と値をつけると、それは拡張子ではなくGET値としてサーバ側で処理されるためです。
端的に言うと、静的なファイル?値とすると、?値部分はサーバ側では無視される書式になります。
クライアント側では?値も含めて同一のリクエストと認識し、キャッシュ済みかどうか判断されます。
詳しい使い方は参考URLをご確認下さい。
検索キーワードとしては CSS キャッシュ 回避 あたりになります。

3: このcssはsassか何かで吐き出しているのでしょうか?

CSS自体は通常のCSSなので、出力の仕方は何でもいいです。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/05/27 16:12

    無知な私に検索キーワードまでありがとうございます!
    キャッシュ回避だったのですね。
    大変わかりやすかったです!完全に理解しました!

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.37%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る