  {"id":88,"date":"2009-04-01T14:07:04","date_gmt":"2009-04-01T13:07:04","guid":{"rendered":"http:\/\/gironi.it\/blog\/?p=88"},"modified":"2024-09-20T14:14:08","modified_gmt":"2024-09-20T13:14:08","slug":"filtrare-i-css-con-i-commenti-condizionali","status":"publish","type":"post","link":"https:\/\/www.gironi.it\/blog\/filtrare-i-css-con-i-commenti-condizionali\/","title":{"rendered":"Filtrare i css con i commenti condizionali"},"content":{"rendered":"<p>In un mondo perfetto tutti i browser esibirebbero un comportamento omogeneo nell&#8217;interpretare le regole css.<\/p>\n<p>Questo, pero&#8217;, non e&#8217; un mondo perfetto ed e&#8217; spesso necessario fare ricorso ad\u00a0<em>hack<\/em> (filtri, trucchi) per differenziare le istruzioni a seconda del browser<br \/>\nutilizzato.<\/p>\n<p>Nel corso degli anni, numerosi hack sono stati sviluppati per ovviare ai bachi dei browser (Internet Explorer <em>in primis<\/em>).<\/p>\n<p>Il metodo piu&#8217; sicuro per intervenire e&#8217; tuttavia offerto dalla tecnica dei<br \/>\n<strong>commenti condizionali<\/strong>. Essi sono commenti xhtml scritti con una<br \/>\nparticolare sintassi, riconosciuta solamente da Internet Explorer per Windows.<\/p>\n<p>Vediamone l&#8217;utilizzo pratico:<\/p>\n<p><!--more--><\/p>\n<div class=\"box\">\n<pre>&lt;!--[if <em>espressione<\/em>]&gt; Qui il codice xhtml &lt;![endif]--&gt;<\/pre>\n<\/div>\n<p>Se la condizione <em>espressione<\/em> e&#8217; soddisfatta, vengono eseguite le espressioni<br \/>\nxhtml.<\/p>\n<h3>Commenti condizionali: esempi concreti di uso<\/h3>\n<div class=\"box\">\n<p>&lt;!&#8211;[if IE]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet<br \/>\nExplorer<\/strong><\/p>\n<p>&lt;!&#8211;[if lt IE 5]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet Explorer versione<br \/>\ninferiore alla 5<\/strong><\/p>\n<p>&lt;!&#8211;[if lte IE 5]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet Explorer versione<br \/>\nuguale o inferiore alla 5<\/strong><\/p>\n<p>&lt;!&#8211;[if IE 5]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet Explorer<br \/>\n5<\/strong><\/p>\n<p>&lt;!&#8211;[if gte IE 5]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet Explorer versione<br \/>\nuguale o superiore alla 5<\/strong><\/p>\n<p>&lt;!&#8211;[if gt IE 5]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet Explorer versione<br \/>\nsuperiore alla 5<\/strong><\/p>\n<p>&lt;!&#8211;[if !IE 5.5]&gt; codice xhtml &lt;![endif]&#8211;&gt;<\/p>\n<p><strong>Il codice viene interpretato solo se il browser e&#8217; Internet Explorer versione<br \/>\ndiversa dalla 5.5<\/strong><\/p>\n<\/div>\n<p>&nbsp;<\/p>\n<p>Molto utile e&#8217; la possibilita&#8217; di <strong>caricare, dopo il foglio di stile generico,<br \/>\nfogli di stile specifici<\/strong>, ad esempio, per le differenti versioni di Internet<br \/>\nExplorer.<\/p>\n<p>Come sempre, un esempio e&#8217; il modo piu&#8217; chiaro per illustrare il concetto.<\/p>\n<p>Supponiamo di aver richiamato, nell&#8217;head del codice xhtml, un foglio di stile<br \/>\ngenerico:<\/p>\n<p>&nbsp;<\/p>\n<div class=\"box\">\n<pre>&lt;link rel=\"stylesheet\" href=\"stile_generico.css\" type=\"text\/css\" \/&gt;<\/pre>\n<\/div>\n<p>&nbsp;<\/p>\n<p>ora carichiamo, dopo la precedente istruzione, un foglio di stile con le correzioni necessarie per le versioni di Internet Explorer inferiori alla 6:<\/p>\n<p>&nbsp;<\/p>\n<div class=\"box\">\n<pre>&lt;!--[if lte IE 6]&gt;\r\n&lt;link rel=\"stylesheet\" href=\"ie5fix.css\" type=\"text\/css\" \/&gt;\r\n&lt;![endif]--&gt;<\/pre>\n<\/div>\n<p>&nbsp;<\/p>\n<p>Fatto!<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In un mondo perfetto tutti i browser esibirebbero un comportamento omogeneo nell&#8217;interpretare le regole css. Questo, pero&#8217;, non e&#8217; un mondo perfetto ed e&#8217; spesso necessario fare ricorso ad\u00a0hack (filtri, trucchi) per differenziare le istruzioni a seconda del browser utilizzato. Nel corso degli anni, numerosi hack sono stati sviluppati per ovviare ai bachi dei browser &hellip; <a href=\"https:\/\/www.gironi.it\/blog\/filtrare-i-css-con-i-commenti-condizionali\/\" class=\"more-link\">Leggi tutto<span class=\"screen-reader-text\"> &#8220;Filtrare i css con i commenti condizionali&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"categories":[1015],"tags":[1183,1073,1185],"class_list":["post-88","post","type-post","status-publish","format-standard","hentry","category-sviluppo-web-it","tag-commenti-condizionali-it","tag-css-it","tag-hack-it"],"lang":"it","translations":{"it":88},"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"post-thumbnail":false},"uagb_author_info":{"display_name":"paolo","author_link":"https:\/\/www.gironi.it\/blog\/author\/paolo\/"},"uagb_comment_info":1,"uagb_excerpt":"In un mondo perfetto tutti i browser esibirebbero un comportamento omogeneo nell&#8217;interpretare le regole css. Questo, pero&#8217;, non e&#8217; un mondo perfetto ed e&#8217; spesso necessario fare ricorso ad\u00a0hack (filtri, trucchi) per differenziare le istruzioni a seconda del browser utilizzato. Nel corso degli anni, numerosi hack sono stati sviluppati per ovviare ai bachi dei browser&hellip;","_links":{"self":[{"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/posts\/88","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/comments?post=88"}],"version-history":[{"count":1,"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/posts\/88\/revisions"}],"predecessor-version":[{"id":3238,"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/posts\/88\/revisions\/3238"}],"wp:attachment":[{"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/media?parent=88"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/categories?post=88"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.gironi.it\/blog\/wp-json\/wp\/v2\/tags?post=88"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}