sintax index escape html haml

index - Etiqueta HTML condicional en HAML



html slim (2)

¿Cómo formatearía HAML para generar un estilo similar a las etiquetas HTML condicionales utilizadas para la orientación entre navegadores?

<!doctype html> <!--[if lt IE 8]> <html class="no-js ie7 oldie" lang="en"> <![endif]--> <!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]--> <!--[if IE 9]> <html class="no-js ie9 oldie" lang="en"> <![endif]--> <!--[if gt IE 9]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

Si agrego un condicional, también ajusta la página completa en el condicional. Pensé en usar HAML :plain filtro :plain en la parte superior y agregar manualmente </html> en la parte inferior, pero esto no me parece lo ideal.


Los tres primeros son bastante simples, ya que son simplemente comentarios en HTML y puedes usar el soporte de Haml para comentarios condicionales :

/[if lt IE 8] <html class="no-js ie7 oldie" lang="en"> /[if IE 8] <html class="no-js ie8 oldie" lang="en"> /[if IE 9] <html class="no-js ie9 oldie" lang="en">

El último es un poco diferente . En resumen, lo que desea son dos comentarios que rodean la etiqueta de apertura html , por lo que el segundo comentario es el primer contenido del elemento html . Además, no puedes usar la sintaxis de Haml para los comentarios condicionales, tendrás que usar un comentario literal. En Haml esto se vería así:

<!--[if gt IE 9]><!--> %html{:class => ''no-js'', :lang => ''en''} <!--<![endif]-->

Esto producirá HTML como este:

<!--[if gt IE 9]><!--> <html class=''no-js'' lang=''en''> <!--<![endif]-->

Si quisiera, podría usar la sintaxis de eliminación de espacios en blanco para hacer que el HTML generado se parezca más a su ejemplo:

<!--[if gt IE 9]><!--> %html{:class => ''no-js'', :lang => ''en''}<> <!--<![endif]-->

Poniendolo todo junto:

!!! /[if lt IE 8] <html class="no-js ie7 oldie" lang="en"> /[if IE 8] <html class="no-js ie8 oldie" lang="en"> /[if IE 9] <html class="no-js ie9 oldie" lang="en"> <!--[if gt IE 9]><!--> %html{:class => ''no-js'', :lang => ''en''}<> <!--<![endif]--> content here

que produce:

<!DOCTYPE html> <!--[if lt IE 8]> <html class="no-js ie7 oldie" lang="en"> <![endif]--> <!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]--> <!--[if IE 9]> <html class="no-js ie9 oldie" lang="en"> <![endif]--> <!--[if gt IE 9]><!--><html class=''no-js'' lang=''en''><!--<![endif]--> content here</html>

Una técnica alternativa sería utilizar el ayudante envolvente de Haml :

= surround "<!--[if gt IE 9]><!--><html class=''no-js'' lang=''en''><!--<![endif]-->", "</html>" do content here


<!doctype html> /[if lt IE 8] <html class="no-js ie7 oldie" lang="en"> /[if IE 8] <html class="no-js ie8 oldie" lang="en"> /[if IE 9] <html class="no-js ie9 oldie" lang="en"> / [if gt IE 9]><! %html.no-js{:lang => "en"} / <![endif]