三種方案避免CSS語(yǔ)法與Smarty沖突
本文向大家描述一下避免Smarty與CSS語(yǔ)法沖突的三種方法,Smarty和CSS的語(yǔ)法存在沖突,因?yàn)槎叨夹枰褂么罄ㄌ?hào){}。如果簡(jiǎn)單地將CSS標(biāo)記嵌入到HTML文檔首部,將導(dǎo)致"不可識(shí)別標(biāo)記"錯(cuò)誤。
避免Smarty與CSS語(yǔ)法沖突
熟悉CSS的人很快就會(huì)發(fā)現(xiàn)Smarty和CSS的語(yǔ)法存在沖突,因?yàn)槎叨夹枰褂么罄ㄌ?hào){}。如果簡(jiǎn)單地將CSS標(biāo)記嵌入到HTML文檔首部,將導(dǎo)致"不可識(shí)別標(biāo)記"錯(cuò)誤:
- <html>
- <head>
- <title>{$title}</title>
- <styletypestyletype="text/css">
- p{
- margin::2px
- }
- </style>
- </head>
- ...
不要擔(dān)心,因?yàn)槲覀冇?種解決方案。
一、使用link標(biāo)記從另一個(gè)文件中提取樣式信息:
- <html>
- <head>
- <title>{$title}</title>
- <linkrellinkrel="stylesheet"type="text/css"href="default.css"/>
- </head>
- ...
二、使用Smarty的literal標(biāo)記將樣式表信息包圍起來(lái)
這些標(biāo)記告訴Smarty不要解析該標(biāo)記內(nèi)的任何內(nèi)容:
- <html>
- <head>
- <title>{$title}</title>
- {literal}
- <styletypestyletype="text/css">
- p{
- margin::2px
- }
- </style>
- {/literal}
- </head>
- ...
三、修改Smarty的默認(rèn)定界符
可以通過(guò)設(shè)置center_delimiter和center_delimiter屬性來(lái)做到這一點(diǎn):
- <?php
- require("Smarty.class.php");
- $smarty=newSmarty;
- $smarty->left_delimiter='';
- $smarty->right_delimiter='';
- ...
- ?>
雖然3種解決方案都能解決問(wèn)題,但其中第一種可能是最方便的,因?yàn)閷SS放在單獨(dú)的文件中是一種常見(jiàn)的實(shí)踐做法。此外,這種解決方案不需要修改Smarty的重要默認(rèn)配置(定界符)。
【編輯推薦】
- CSS中margin屬性及其使用探究
- CSS樣式實(shí)現(xiàn)快速定位bug的六大技巧
- CSS中l(wèi)ink和@import的區(qū)別
- CSS2.0中page-break-after屬性用法
- 技術(shù)分享 使用不同CSS樣式兼容多種瀏覽器