本文介绍了rails asset pipeline:无效的CSS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想使用
在我的rails应用程序中实现照片墙。我插入CSS的列表,段落和图像,只有图像高度和宽度的变化,我的custom.css.scss像这样:

I am trying to use http://designshack.net/articles/css/build-an-animated-photo-wall-with-css/to implement a photo wall in my rails app. I plugged the CSS for list, paragraph and image, with the only changes in image height and width into my custom.css.scss like so:

/* picture wall */

/*------CONTAINER------*/
.container {
  width: 320px;
  margin: 0 auto 50px auto;
}

/*------LIST------*/
.container ul {
  list-style-type: none;
}
 
.container li {
  float: left;
  position: relative;
  width: 280px;
  height: 187px;
  overflow: hidden;
}
 
.container li:hover {
  cursor: pointer;
}

/*------PARAGRAPH------*/
.container li p {
  color: transparent;
  background: transparent;
  font: 200 10px/80px 'Arvo', Helvetica, Arial, sans-serif;
  text-align: center;
  text-transform: uppercase;
   
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
 
 
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
 
.container li:hover p {
  color: white;
  background: #000; /*fallback for old browsers*/
  background: rgba(0,0,0,0.7);
}

/*------IMAGES------*/
.container img {
  width: 80px;
  height: 80px;
   
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
 
.container li:hover img {
  width: 100px;
  height: 100px;
}

资产管道在该文件中引发以下错误:

The asset pipeline throws the following error in that file:

Invalid CSS after "  position:": expected pseudoclass or pseudoelement, was " absolute;"

注释位置行会显示文件中的下一行:

Commenting out the position line brings up the next line in the file:

Invalid CSS after "  top:": expected pseudoclass or pseudoelement, was " 0;"

语法问题?我不能简单地把有效的css到一个scss文件?是什么赋予了?

A syntax problem? Can I not simply put valid css into an scss file? What gives?

推荐答案

尝试删除 text-transform:uppercase;

这篇关于rails asset pipeline:无效的CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-17 13:06
查看更多