避免smarty与css语法冲突的方法

简介:

避免smarty与css语法冲突的方法


本文实例讲述了避免smarty与css语法冲突的方法。分享给大家供大家参考。具体分析如下:

熟悉css的人很快就会发现smarty和css的语法存在冲突,因为二者都需要使用大括号{}。如果简单地将css标记嵌入到html文档首部,将导致不可识别标记错误:


 
 
  1. <html> 
  2.  
  3. <head> 
  4.  
  5. <title>{$title}</title> 
  6.  
  7. <style type=text/css> 
  8.  
  9. p{ 
  10.  
  11. margin::2px 
  12.  
  13.  
  14. </style> 
  15.  
  16. </head> 
  17.  
  18. ... 

不要担心,因为我们有3种解决方案。

一、使用link标记从另一个文件中提取样式信息:


 
 
  1. <html> 
  2.  
  3. <head> 
  4.  
  5. <link rel=stylesheet type=text/css href=css/default.css/> 
  6.  
  7. </head> 
  8.  
  9. ... 

二、使用smarty的literal标记将样式表信息包围起来

这些标记告诉smarty不要解析该标记内的任何内容:


 
 
  1. <html> 
  2.  
  3. <head> 
  4.  
  5. {literal} 
  6.  
  7. p{ 
  8.  
  9. margin::2px 
  10.  
  11.  
  12. </style> 
  13.  
  14. {/literal} 
  15.  
  16. </head> 
  17.  
  18. ... 

三、修改smarty的默认定界符

可以通过设置center_delimiter和center_delimiter属性来做到这一点:


 
 
  1. require(smarty.class.php); 
  2.  
  3. $smarty=newsmarty; 
  4.  
  5. $smarty->left_delimiter=''
  6.  
  7. $smarty->right_delimiter=''
  8.  
  9. ... 
  10.  
  11. ?> 

虽然3种解决方案都能解决问题,但其中第一种可能是最方便的,因为将css放在单独的文件中是一种常见的实践做法。此外,这种解决方案不需要修改smarty的重要默认配置(定界符)。

希望本文所述对大家的php程序设计有所帮助。


来源:51CTO

相关文章
|
5月前
|
前端开发
css页面顶部底部固定,中间自适应几种方法
【10月更文挑战第22天】css页面顶部底部固定,中间自适应几种方法
|
5月前
|
缓存 监控 前端开发
CSS 提高性能的方法
【10月更文挑战第24天】在实际应用中,还需要根据具体项目的特点和需求,灵活选择和组合这些方法,不断进行优化和改进。同时,随着技术的不断发展,也需要持续关注新的性能优化技巧和最佳实践,以保持在性能优化方面的领先地位。你对 CSS 性能优化还有哪些深入的思考和经验呢?欢迎进一步交流和分享。
|
6月前
|
前端开发 容器
CSS 中几种常用的换行方法
CSS 中几种常用的换行方法
68 1
|
7月前
|
XML 前端开发 JavaScript
jQuery HTML / CSS 方法
jQuery HTML / CSS 方法
48 2
|
7月前
|
前端开发 JavaScript
jQuery css() 方法
jQuery css() 方法
48 3
|
6月前
|
前端开发 UED
css性能优化的方法
css性能优化的方法
66 0
|
7月前
|
前端开发 JavaScript
jQuery css() 方法
jQuery css() 方法
42 1
|
6月前
|
前端开发
CSS 动画介绍及语法
CSS 动画介绍及语法
75 0
|
6月前
|
前端开发
CSS绘制三角形的方法
CSS绘制三角形的方法
|
8月前
|
前端开发 容器
css溢出隐藏的五种方法
css溢出隐藏的五种方法
159 1
下一篇
oss创建bucket