HTML design question . . . . hiding .css file(s)

I occasionally do some basic HTML coding and design work. Over the past few years I have become more familiar with Cascading Style Sheets which are used in HTML coding. These have the extension of .css

To use a Cascading Style Sheet, the following code is placed near the beginning of the HTML file in question. ( Here I assume that the name of my stylesheet is formosa.css )

What I am wondering is this – After the HTML files and all related files, graphics, etc. are uploaded to a webserver, is it is possible to actually hide the CONTENT of the .css file from casual observers??

In other words, the .css file would be there for my HTML file(s) to read, but if a third party tried to open the .css file, he would get some sort of “UNAUTHORIZED ENTRY” notice . . . . . . . or whatever . . . . . and be unable to look at, read, or download the .css file . . . . . . . . . . .

I would be interested in the comments of any HTML programmers who have experience in this area. Thank you.

Yes, it is. :slight_smile: You can use an “.htaccess” file to limit access to any file that you don’t want to be accessed directly, i.e. only browers that also (concurrently) access your web pages (html files) can/will see those other files.

Here is a sample text (code) for your “.htaccess” file:

[quote]RewriteEngine on
RewriteCond %{HTTP_REFERER} !^https?://(www.)?yourdomain.org.tw/ [NC]
RewriteRule .css - [F,NC]
ErrorDocument 403 "[/quote]
(in case of unauthorized access the above code returns “nothing”)

Note 1: Please note that there is a good chance this will not work on your server exactly as it is written but may need to be slightly modified to match the setup of your web server; also the server needs to be set to permit you to make use of the rewrite function - if in doubt of if things don’t work, consult a techie at your provider’s.
Note 2: if there is anything in the “.htaccess” file that your sever cannot interpret or doesn’t like, you may get a 500 type error and nothing works (your pages will be inaccessible); so please always confirm that things are working as required after even the smallest change you make to the ".htaccess "file)

When designing HTML pages, we now frequently use “Cascading Style Sheets” which are often simply called CSS files.

I am wondering:
Is there any way to hide a CSS file on the server, so that it cannot be viewed or copied by other persons?

Perhaps someone with advanced knowledge of HTML design issues could offer some advice on this question. Thanks.

There are some basic methods using the “import” statement here.

And a quick Google search reveals that you yourself asked the same question in March on this board…and got an answer. Searching both this board and the Internet are good things. :smiley:

You can’t do it in any meaningful way – to work at all, the browser has to be able to get at the content, which means the user can too. For code some people use obfuscators, but CSS doesn’t lend itself well to that.

I’m baffled as to why you’d want to, though.

[quote=“Hartzell”]I occasionally do some basic HTML coding and design work. Over the past few years I have become more familiar with Cascading Style Sheets which are used in HTML coding. These have the extension of .css

To use a Cascading Style Sheet, the following code is placed near the beginning of the HTML file in question. ( Here I assume that the name of my stylesheet is formosa.css )

What I am wondering is this – After the HTML files and all related files, graphics, etc. are uploaded to a webserver, is it is possible to actually hide the CONTENT of the .css file from casual observers??

In other words, the .css file would be there for my HTML file(s) to read, but if a third party tried to open the .css file, he would get some sort of “UNAUTHORIZED ENTRY” notice . . . . . . . or whatever . . . . . and be unable to look at, read, or download the .css file . . . . . . . . . . .

I would be interested in the comments of any HTML programmers who have experience in this area. Thank you.[/quote]

You cannot hide CSS content. Google Chrome can retrieve any CSS files required by the HTML page loaded in the browser (Google Chrome > Tools > Developer Tools > Resource (tab) > “.css”)