这个问题已经在htc文件中被问到:为什么不使用它们?但答案并没有回答任何问题.
问题是,为什么CSS3 PIE之类的东西 在许多网站上都没有使用?我希望较小的人不知道它,但引起我注意的那个是Twitter,他没有使用它.
是因为它不标准吗?或者是否会导致网站明显减慢?
感谢您的回复.
我试图在我的asp.net mvc 3.0应用程序中使用CSS3Pie但是在IE版本中比9更爱的边界完全消失了.这是我的CSS
.box
{
margin:auto;
display:table;
text-align:center;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border: 1px solid #86b0ca;
margin:10px 0 10px 0;
behavior: url("/Scripts/htc/PIE.htc"); /*if i remove that the border not disappeared but square in old IE versions*/
}
Run Code Online (Sandbox Code Playgroud) CSS3 Pie是一个很棒的工具,可以在IE中呈现一些CSS3.爱它!但与Wordpress的集成似乎相当困难.情况如下:
页面模板上的Html:
<div class="page_header_text center_shadow">
<p>test12</p>
</div>
Run Code Online (Sandbox Code Playgroud)
Function.php :(来自http://www.position-relative.com/2011/04/using-css-pie-in-wordpress-themes-updated/)
global $wp_styles;
wp_enqueue_style( "ie8", "http://dennishunink.nl/ghana/wp/wp-content/themes/ghanavakantie/style/iePie.css", false, $version_identifier, "all");
$wp_styles->add_data( "ie8", 'conditional', 'IE 8' );
Run Code Online (Sandbox Code Playgroud)
iePie.css:
.center_shadow{
position: relative;
behavior: url(PIE.htc);
}
Run Code Online (Sandbox Code Playgroud)
实际上,应用了iePie.css文件.例如,背景:#000; 工作中.但是以一种奇怪的方式,PIE.htc文件却没有.
我尝试了不同的相对和绝对路径,在不同的位置上传了PIE.htc.
该网站位于http://dennishunink.nl/ghana/wp/(仍在开发中)
希望有人有答案,非常感谢每一个建议!
我有以下css代码:
-webkit-gradient(linear, left bottom, left top, from(#5AE), to(#036));
Run Code Online (Sandbox Code Playgroud)
这在Chrome中非常好地显示了背景.Internet Explorer只显示白色背景.我尝试使用CSS 3馅饼,它没有改变任何东西.
以下是我的css:
body {
behavior: url(css3pie/PIE.htc);
color: #000000;
font-family: Arial, Helvetica, sans-serif;
margin: 0px;
padding: 0px;
/*background:url("../image/bg.png") repeat scroll 0 0 transparent;*/
background: -webkit-gradient(linear, left bottom, left top, from(#5AE), to(#036));
}
Run Code Online (Sandbox Code Playgroud)
谢谢
这是使用CSS3 PIE的CSS
border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
background: #EEFF99;
behavior: url(/PIE.htc);
Run Code Online (Sandbox Code Playgroud)
特别
behavior: url(/PIE.htc);
Run Code Online (Sandbox Code Playgroud)
我的问题是这个PIE.htc是由所有浏览器下载还是仅在IE 7和8中下载?
我需要在IE7和8中显示圆角.因此我认为不是使用Modernizr而是为圆角编写另一个类和图像,CSS3 PIE将是很好的解决方案,因为无论何时我们将改变边框的颜色和厚度以及元素PIE.htc的高度将在IE7和8中呈现相同.但在Modernizr和图像的情况下,我们将不得不使用上传新图像,我们将不得不更改和上传新的更改.
而且因为我正在使用Modernizr,所以我无法加载条件注释,它将为每个浏览器加载,即使我不需要.所以我认为如果CSS3 PIE有利于灵活性,如果它只加载到IE7和8,那么在这种特殊情况下使用它会很好.
我觉得很愚蠢,就像我错过了一些非常明显的东西,但我已经检查了一切,无法弄清楚是什么问题.我正在尝试使用CSS3pie在ie8中制作圆角,但它不会采取.
我有相对于html文档设置的路径,而不是css.它位于一个名为pie的文件夹中,所以这就是我在CSS中使用的:
#recommended-acc {
float: left;
width: 472px;
background: url(../img/cont_bg.png) repeat;
margin: 10px;
padding: 0 10px 6px 0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
behavior: url(pie/PIE.htc);
border-radius: 5px;
border: 1px #d8d8d8 solid;
}
Run Code Online (Sandbox Code Playgroud)
有谁知道更多关于css3馅饼谁可能会告诉我我缺少什么?我已经在很多不同的元素上试过了它并没有用过一次.
我正在尝试使用css3pie与asp.net mvc一起工作,但由于某种原因它不起作用.
我有一个包含内联css的视图,如下所示:
@{
ViewBag.Title = "Home Page";
}
<div>
<div class="contentWrapper" style="width:600px;margin:25px auto;">
Hello World
<input name="button" value="Button" class="button" type="button" />
</div>
</div>
@section BreadCrumb {
<div class="breadcrumb">
</div>
<div class="pageTitle">
<h1></h1>
</div>
}
@section HeaderContent {
<style type="text/css">
.contentWrapper
{
border: 1px solid #ddd;
padding: 30px 40px 20px 40px;
background: #fff;
/* -- CSS3 - define rounded corners for the form -- */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
/* -- CSS3 - create a background graident -- …Run Code Online (Sandbox Code Playgroud) 当我以两种不同的方式访问使用CSS3 PIE的站点时,在一种情况下找不到HTC文件.我正在使用示例域名和路径名来说明下面的问题.是什么导致这种情况发生?
http://sampledomain.com/site < - 在IE8中不呈现圆角
http://sampledomain.com/site/ < - 渲染圆角
CSS圆角文件位于
该网站包含来自的CSS文件
http://cdn.cdndomain.com/path/to/content/css/rounded-corners.css
CSS:
.rounded-corners
{
behavior: url(content/css/pie.htc);
}
Run Code Online (Sandbox Code Playgroud) 我想使用border-image作为流畅的缩放CSS容器.是否可以使用某些.js框架在所有现代浏览器上启用此CSS3功能?如果没有,是否有一个很好的替代品?
有关我想要实现的目标的示例,请参阅:http: //www.css3.info/preview/border-image/