【问题标题】:where do I put the PIE.htc file (for making IE work with CSS3) when I'm using cakephp当我使用 cakephp 时,我在哪里放置 PIE.htc 文件(用于使 IE 与 CSS3 一起工作)
【发布时间】:2011-10-23 17:49:22
【问题描述】:

我正在尝试使用PIE.htc,这是一个脚本,希望可以让我在 IE6-8 中使用 CSS3 功能。我也在使用 Cakephp(我越来越喜欢它了)

根据说明,我只需将 PIE.htc 文件粘贴到我想要的任何位置,然后将 behavior: url(path/to/PIE.htc); 添加到 CSS 中。所以我有:

input[type=text]{
    width:348px;
    height:30px;
    border:1px solid #ddd;
    padding:3px;
    background:url(../img/formfieldbg.gif) repeat-x;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    vertical-align:top;
    behavior: url(path/to/PIE.htc);}

它还说:注意:这个路径是相对于正在查看的 HTML 文件的,而不是它被调用的 CSS 文件。

我正在使用 Cakephp,无论我为路径放置什么,无论我将 PIE.htc 文件放在哪里,我都无法让它工作!当我在 IE6 中查看它时,我的输入仍然没有像在 FF 中那样可爱的圆角。

【问题讨论】:

    标签: internet-explorer css css3pie


    【解决方案1】:

    尝试使用绝对路径:

    behavior: url(/path/to/PIE.htc);
    

    注意前面的正斜杠。这样,无论当前页面是什么,.htc 文件的路径都将保持不变。

    完整的 URL 也可以:

    behavior: url(//example.com/path/to/PIE.htc);
    

    如果您确实使用了完整的网址,请使用protocol relative url,这样您在切换到 https 时就不会收到不安全的内容警告。

    在使用 PIE 时,很多元素需要 position:relativezoom:1 才能在 IE 中运行,请确保检查 known issues 页面并玩转直到你让它工作。

    【讨论】:

    • 您好,感谢您的回答。我尝试使用正斜杠,我所拥有的是行为:url(/PIE.htc);我已经尝试将 PIE.htc 文件放在 app/ 中的 app/webroot 中的 app/views 等中,但它似乎仍然没有收到它。有什么想法可能会出错吗?谢谢
    • 您是否尝试过直接导航到 url(在地址栏中)以确保您可以访问它?尝试将其放在与 CSS 文件相同的目录中以确保。
    • 是的,如果我在地址栏中输入 localhost/myproject/PIE.htc 它就会出现。我已经尝试将文件放在几乎所有地方。它应该与文本输入字段上的边框半径一起使用,不应该。
    • behavior: url(/PIE.htc);behavior: url(/myproject/PIE.htc); 应该适合你(取决于你的项目的根目录实际在哪里)。它应该在输入上工作,但为了确保它正在加载,我建议从 PIE 主页上的示例中复制/粘贴 HTML/CSS,直到你看到它工作为止。如果您正在使用AddType text/x-component .htc,您可能还需要将AddType text/x-component .htc 添加到您的.htaccess 中。
    • 您好,非常感谢您的帮助。我尝试在新页面上进行测试,而不是使用输入,而只是使用普通的 div,我发现当我有行为时: url(/myproject/PIE.htc);它有效果。但不幸的是,效果是完全删除了边框 - 输入文本框完全消失了?!?但至少它必须选择 htc 文件,因为它有一些效果。我想我的其他 css 一定有问题导致奇怪的行为?朱莉娅
    【解决方案2】:

    您需要指定 pie.php 文件。其内容如下:

    <?php
    /*
    This file is a wrapper, for use in PHP environments, which serves PIE.htc using the
    correct content-type, so that IE will recognize it as a behavior.  Simply specify the
    behavior property to fetch this .php file instead of the .htc directly:
    
    .myElement {
        [ ...css3 properties... ]
        behavior: url(PIE.php);
    }
    
    This is only necessary when the web server is not configured to serve .htc files with
    the text/x-component content-type, and cannot easily be configured to do so (as is the
    case with some shared hosting providers).
    */
    
    header( 'Content-type: text/x-component' );
    include( 'PIE.htc' );
    ?>
    

    这应该可以解决问题。

    【讨论】:

      【解决方案3】:

      我正在使用带有 mod_rewrite 的 CodeIgniter。根据 Septagram 的回答,我得到了以下工作

      RewriteEngine on
      
      RewriteCond %{REQUEST_FILENAME} -s [OR]
      RewriteCond %{REQUEST_FILENAME} -l [OR]
      RewriteCond %{REQUEST_FILENAME} -d
      RewriteRule ^.*$ - [NC,L]
      
      #if the url contains PIE.php redirect to the folder containing PIE.php
      RewriteCond %{REQUEST_URI} PIE.php$
      RewriteRule ^.*$ css3pie/PIE.php [NC,L]
      
      #else just redirect to index
      RewriteRule ^.*$ index.php [NC,L]
      

      希望这对某人有所帮助

      【讨论】:

        【解决方案4】:

        如果您碰巧使用mod_rewrite,那么以下小技巧可能适合您:

        RewriteRule /PIE.htc$ PIE.htc [L]
        

        将此添加到.htaccess,瞧!现在PIE.htc 神奇地出现在每个文件夹中:)

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2011-06-19
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多