"No More CSS Hacks" for the non-programmer

[andrej`]

Quote sa stylegala foruma

Quote:

Intro Today I read David Hellsing's "No More CSS Hacks" which (if you haven't read it) explains and gives examples to for how to go about serving up browser specific css using php... essentially replacing css hacks. It's a great article and very informative. However, it's my opinion that the sight of all that php code can scare away the non-programmers among us. I've been using server-side css "hacks" for the half-year or so. At some point (I guess about four months ago) I got sick of writing repetitive php if statements in my css. It took to long, and it made it harder to read. So I wrote a simple markup and parser to save myself time. What it does? Instead of: #container { <?php if ($browser == "internet explorer") { ?> width: 600px; <?php } else { ?> width: 400px; <?php } ?> You write: #container { <if internet explorer> width: 600px; <else> width: 400px; <end> More examples: <if internet explorer 6> <if less than internet explorer 6> <if not firefox 1.5> <if greater than firefox 0.8> <if opera> It's my hope that this nice and easy syntax will make the use of server-side css hacks a little less scary for the non-programmers among us. How to use Rename your stylesheet to give it a ".php" extension. Add this to beginning of stylesheet: <?php ob_start(); ?> Add this to end of stylesheet: <?php header("Content-type: text/css"); $stylesheet = ob_get_clean(); $browsers = array("OPERA", "MSIE", "NETSCAPE", "FIREFOX", "SAFARI", "KONQUEROR", "MOZILLA"); $browser = "OTHER"; $version = 0.0; foreach ($browsers as $x) { if (($s = strpos(strtoupper($_SERVER['HTTP_USER_AGENT']), strtoupper($x))) !== FALSE) { $version = (double) preg_replace("/[^0-9,.]/", "", substr($_SERVER['HTTP_USER_AGENT'], $s + strlen($x), 6)); $browser = $x == "MSIE" ? "internet explorer" : strtolower($x); break; } } preg_match_all("/\<if(?P<not> not )?(?P<less> less than )?(?P<greater> greater than )? ?(?P<browser>[a-zA-Z ]*?) ?(?P<version>[0-9\.]*?)? ?\>/mi", $stylesheet, $matches); for ($x = 0; $x < count($matches[0]); $x ++) { $start = strpos($stylesheet, $matches[0][$x]); $end = strpos($stylesheet, "<end>", $start); $else = strpos($stylesheet, "<else>", $start); $length = strlen($matches[0][$x]); if (! ($matches["less"][$x] && $version < $matches["version"][$x] || $matches["greater"][$x] && $version > $matches["version"][$x] || ($matches["not"][$x] ? (($matches["version"][$x] && $matches["version"][$x] == $version) || ($matches["browser"][$x] == $browser)) : (($matches["version"][$x] && $matches["sversion"][$x] != $version) || ($matches["browser"][$x] != $browser))))) { if ($else < $end && $else) { $stylesheet = substr($stylesheet, 0, $start) . substr($stylesheet, $start + $length, $else - $start - $length) . substr($stylesheet, $end + 5); } else { $stylesheet = substr($stylesheet, 0, $start) . substr($stylesheet, $start + $length, $end - $start - $length) . substr($stylesheet, $end + 5); } } else { if ($else < $end && $else) { $stylesheet = substr($stylesheet, 0, $start) . substr($stylesheet, $else + 6, $end - $else - 6) . substr($stylesheet, $end + 5); } else { $stylesheet = substr($stylesheet, 0, $start) . substr($stylesheet, $end + 5); } } } echo(preg_replace("/\*\//", "*/\n" , preg_replace("/}/", "}\n" , preg_replace("/\n[ \t]*\r/", "" , $stylesheet)))); ?> And you're done. Begin adding special statements. Additional Notes: Browsers are labeled with lower case letters (examples: internet explorer, netscape, firefox, opera). Don't try to user "greater than" or "less than" in conjunction with "not"... that's just asking for trouble. I'm sure that that code isn't perfect. I haven't uber-extensively tested it. If you spot any errors, please let me know. By rearranging the order of browser detection (adding opera before msie) you should be able to sniff out opera even when it pretends to be internet explorer. I've added a few simple regular expressions at the end to make the output neat and tidy in terms of line-spacing.

Nisam probao još, ali čini mi se jako dobro i jednostavno za koristit. Mišljenja?

[niksy]

Meni se ovo cini kao super stvar, dobijes jednostavniji pregled u kod.
Sulien, maratz?

[Sulien]

Ljudi koriste PHP za CSS već jako dugo, tako i ja - kad treba. A u većini slučajeva mi ne treba.

[carr]

meni se ovo ne svidja, i kvotam suliena po tome.

[Gale]

Stara stvar

[/dev/null]

A kada neko ima custom agent string? Ovo nije konacno resenjea a samim tim ja mislim da je sucks

[sime]

smeće(tm)

[budha]

bzveze. jel toliki problem naucit PHP if-else sintaksu?

[andrej`]

budha wrote:

bzveze. jel toliki problem naucit PHP if-else sintaksu?

Neki to vole ovako

[Samurai]

With all do respect David Hellsing, ...let's not complicate things.

[budha]

andrej` wrote:

budha wrote: bzveze. jel toliki problem naucit PHP if-else sintaksu? Neki to vole ovako

to ne iskljucuje tvrdnju da je rjesenje glupo