Using a .php file as a stylesheet

Discussion in 'Scripts, 3rd Party Apps, and Programming' started by shant93, Dec 28, 2010.

  1. misson

    misson Community Paragon Community Support

    Messages:
    2,572
    Likes Received:
    72
    Trophy Points:
    48
    Nope. IE once used extensions to determine content type (newer versions should be correcting this), and other browsers might as a fallback in case there is no Content-type header, but other than that file extensions don't matter. The only thing that should affect caching are HTTP headers.
     
  2. callumacrae

    callumacrae not alex mac Community Support

    Messages:
    5,257
    Likes Received:
    97
    Trophy Points:
    48
    That's very inefficient - generate it, then copy and paste it into a css file. Using PHP will use server resources that could be avoided by simply using static CSS.

    Also re the random colour: The browser will cache the css anyway, so it wont be random. You'll either have to force the browser to redownload the css every time (extremely inefficient) or just put it in the html.

    ~Callum
     
    Last edited: Jan 3, 2011
  3. aakbar9372

    aakbar9372 New Member

    Messages:
    6
    Likes Received:
    0
    Trophy Points:
    0
    agreed, I'm using firefox on ubuntu, every HTML pages (even URL rewritten) that do not contain caching HTTP headers is cached (such as this forum page)
     
  4. shant93

    shant93 Member

    Messages:
    119
    Likes Received:
    0
    Trophy Points:
    16
    For the generating, I agree that the generated stylesheet should not be generated every time, and for the custom color, that may explain why the same colors keep recurring, but how else am I supposed to have a random color without doubling the size of the index page with a style tag?
     
  5. lemon-tree

    lemon-tree x10 Minion Community Support

    Messages:
    1,420
    Likes Received:
    46
    Trophy Points:
    48
    Use Javascript to set the colour on page load; this offloads the work to the client and means your CSS can be a static file.
    You'll need to have a fallback colour set in your CSS that the script will use if the user doesn't have Javascript enabled though.
     
  6. shant93

    shant93 Member

    Messages:
    119
    Likes Received:
    0
    Trophy Points:
    16
    How does JavaScript set the color without using PHP?
    (and without using at least 30 document.getElementbyId().style.color and document.getElementbyId().style.background-color)
     
  7. callumacrae

    callumacrae not alex mac Community Support

    Messages:
    5,257
    Likes Received:
    97
    Trophy Points:
    48
    It would be easier to get PHP to generate a colour and send it in a style tag in the header. This way, it won't be cached :)

    ~Callum
     
  8. misson

    misson Community Paragon Community Support

    Messages:
    2,572
    Likes Received:
    72
    Trophy Points:
    48
    Either set the colors on an ancestor element and rely on the cascade, or use a class. In all modern browsers, you can access style sheets via document.styleSheets and add rules (though the method differs between IE and other browsers). You can add support for DOM methods to IE, or you can use MDC's example cross-browser function to add stylesheet rules.

    Code:
    if (document.styleSheets && document.styleSheets.length && ! document.styleSheets[0].insertRule) {
        if (document.styleSheets[0].addRule) {
            document.styleSheets[0].constructor.prototype.insertRule = function(ruleset, idx) {
                // not a perfect parsing, but will do for the most part.
                var pieces = ruleset.match(/^\s*([^{]*){(.*)}\s*$/);
                if (pieces) {
                    var selector = pieces[1], 
                          rules = pieces[2];
                    this.addRule(selector, rules, idx);
                }
            };
            document.styleSheets[0].constructor.prototype.deleteRule = function(idx) {
                return this.removeRule(idx);
            };
        } else {
            // TODO: support unusual browsers
            document.styleSheets[0].constructor.prototype.insertRule = function(ruleset) {
                ...
            };
            document.styleSheets[0].constructor.prototype.deleteRule = function(idx) {
                ...
            };
        }
    }
     
    Last edited: Jan 8, 2011

Share This Page