标头缓存似乎被忽略了

I've been wondering what seems to be wrong in my cache.

I set this headers so that it will not cache contents on the website (html, css, php) files.

header('Cache-Control: no-cache, no-store, must-revalidate'); // HTTP 1.1.
header('Pragma: no-cache'); // HTTP 1.0.
header('Expires: 0'); // Proxies.

So I went on to clear cache first on my Mozilla, reload the page then got this:

enter image description here

Seems fine because status is 200 OK, now I edited the file style.css then do a refresh, here is the result:

enter image description here

It says 304 Not Modified. I am no expert but isn't that means it cache the file? Also, I edited style.css, and my changes didn't appear. Need to do a Ctrl+F5 to reset it. Why is that?

Extending from comments:

What you were doing on your headers only affect that resource -- which most likely would be a PHP-generated HTML page.

To demonstrate, here's a simplified process:

Browser: GET index.php
Server: PHP: Cache-Control: no-cache; output content...
Browser: GET style.css
Server: (Default headers;) output style.css

So to ask the client to not cache CSS, you can:

Add additional header for all CSS in your HTTP server configuration. Example in Apache:
```
<FilesMatch "\.css$">
    Header add Cache-Control no-cache
</FilesMatch>
```

Use PHP to redistribute CSS:

<?php
header("Content-Type: text/css");
header("Cache-Control: no-cache");
?>
body {
/* ... */
}

If you don't mind modifying HTML on every edit (or if you're using some kind of version control that support this feature), you can make your HTML look like this:
```
<link rel="stylesheet" type="text/css" href="style.css?20131111" />
```