无法使用site.com平台导入bootstrap css

Question

我正在尝试通过site.com/salesforce平台实现bootstrap，但是在导入css时，我可以导入bootstrap.css和bootstrap.min.css，但是bootstrap-responsive和bootstrap-responsive.min会失败，因为，根据site.com，“错误：CSS代码无法保存，因为它没有正确形成。确保代码不包含无效字符，例如不匹配或缺少括号，然后再试一次”。

我认为这是因为css中的“@”，例如“@ -ms-viewport”，但我找不到解决方法。非常感谢任何解决这个问题的想法。

Answer 1

一种解决方法是将css文件导入为文档，并选择不将其转换为css：

您可以像平常一样在模板/页面设置区域中添加样式表：

这样做的一个缺点是样式不会被拉入页面编辑器。但是，它们在用户端完全正常运行。

希望这有帮助！

Answer 2

您可以将带有@ -webkit- [x]元素的样式表导入Site.com。问题可能在其他地方。我已经看到它发生在其他CSS验证器错过的分号丢失时。我认为Site.com导入工具比您习惯使用的其他工具更严格。

如果您有一个格式正确的样式表，导入会更容易，您可以在Site.com编辑器中创建一个空样式表。在您编辑该样式表时，您会看到一个标有“编辑样式表代码”的按钮;如果您点击该按钮，您将拥有一个编辑器对话框，您可以将现有的样式表粘贴到零碎的中。确保粘贴完整的块 - 您需要对粘贴的任何样式项进行完整定义，包括结束括号。

当您逐步粘贴到现有样式表中时，可以“快速保存”样式表，当它无法保存时，您将找到形状不佳的CSS块。您可能会在该块中看到错误并能够轻松修复它 - 如果没有，您可以省略它或通过常规样式表编辑过程创建具有相同属性的同名新样式项。

无论哪种方式，您都可以继续在样式表中粘贴，直到您加载完整有效的样式表。

Answer 3

我做了David Scruggs的建议并将bootstrap.css的各个部分粘贴到Site.com编辑器中。我成功地粘贴了所有的css选择器，除了以下 -

.carousel-control.left {
  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, .5) 0%), color-stop(rgba(0, 0, 0, .0001) 100%));
  background-image:         linear-gradient(to right, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, .0001) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
  background-repeat: repeat-x;
}
.carousel-control.right {
  right: 0;
  left: auto;
  background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, .0001) 0%), color-stop(rgba(0, 0, 0, .5) 100%));
  background-image:         linear-gradient(to right, rgba(0, 0, 0, .0001) 0%, rgba(0, 0, 0, .5) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
  background-repeat: repeat-x;
}
@-ms-viewport {
  width: device-width;
}

希望这会对你有所帮助。

Answer 4

我们注意到将自定义css文件导入site.com的类似问题，它似乎是calc标记。实施例：width: calc(50% - 30px);