小编Kat*_*ieK的帖子

sass @import"指南针/重置"错误

我想在我的静态HTML项目中使用Sass和Compass,但按照说明操作不起作用.这就是我做的:

$ gem install compass
$ cd <myproject>
$ compass install compass .
Run Code Online (Sandbox Code Playgroud)

等待的是:

directory ./sass/
directory ./stylesheets/
   create ./sass/screen.scss 
   create ./sass/print.scss 
   create ./sass/ie.scss 
   create ./stylesheets/screen.css 
   create ./stylesheets/ie.css 
   create ./stylesheets/print.css 
Run Code Online (Sandbox Code Playgroud)

但是当我开始观看scss时sass --watch sass:stylesheets,我收到一个错误:

error sass/screen.scss (Line 6: File to import not found or unreadable: compass/reset.
Run Code Online (Sandbox Code Playgroud)

这个msg与@import"指南针/重置"相关;

我在Ubuntu上做什么才能看到罗盘进口?

ruby rubygems sass

12
推荐指数
1
解决办法
1万
查看次数

在右侧打开萤火虫

我已经使用Widerbug(http://www.command-tab.com/2008/01/19/widerbug-widescreen-firebug/)在浏览器的右侧而不是在底部打开Firebug.最近我更新了我的FF,现在widebug不起作用.我安装了最新版本的Firebug,但这没有用.如何将Firebug附加到浏览器的右侧?

firebug

12
推荐指数
1
解决办法
6379
查看次数

Aptana Studio 3代码辅助Sass(.scss)文件

我正在使用Aptana Studio 3,我希望获得代码辅助功能以适用于Sass(.scss)文件.如果代码辅助不适用于Sass语法/声明,那就没问题,但是我希望获得标准CSS声明的语法突出显示和代码完成帮助.因此,例如,如果我输入"background",我希望编辑器显示与HTML相同的语法.

我为.scss文件添加了一个新的文件关联首选项(从这里:https://wiki.appcelerator.org/display/tis/Changing+your+file+association+preferences),并将CSS编辑器指定为默认值.scss文件的编辑器.这让我突出了语法,但CSS规则没有代码完成帮助.

我做错了什么,或者我只是因为获得代码完成/代码辅助帮助而运气不好?

css aptana editor sass code-assist

11
推荐指数
1
解决办法
9656
查看次数

用于强制浏览器显示滚动条的CSS

我写了一个Web应用程序,发现当我调整页面大小时,浏览器不会显示它自己的滚动条,因为窗口缩小了.这可以防止用户访问内容.我将我的身体宽度设置为500px并将导航栏设置为white-space:nowrap.如何让浏览器识别屏幕右侧有内容?

只是为了澄清我想要浏览器的滚动条而不是任何控件上的滚动条.

html javascript css

11
推荐指数
1
解决办法
2万
查看次数

SCRIPT1014:无效字符

我有这个脚本:

function slideSwitch() {
    var ae = jQuery('#featured-right a.active');
    if ( ae.length == 0 ) {
        ae = jQuery('#featured-right a:first');
        var i = jQuery('#featured-right a').index(ae);
        var bae = jQuery('#featured-left a.fb-'+i);
        bae.show();
    }

    var ne =  ae.next().length ? ae.next() : jQuery('#featured-right a:first');
}

$(document).ready(function(){
    var ae = jQuery('#featured-right a.active');
    if ( ae.length == 0 ) {
        ae = jQuery('#featured-right a:first');
        ae.addClass('active');
        var i = jQuery('#featured-right a').index(ae);
        jQuery('#featured-left a.fb-'+i).show();
        jQuery('#featured-right a:not(.active) span.key').hide();
    }
    setInterval("slideSwitch()", 1000);  
});
Run Code Online (Sandbox Code Playgroud)

它适用于除IE之外的任何浏览器.在IE上,IU得到

SCRIPT1014: Invalid character featured.js, line …
Run Code Online (Sandbox Code Playgroud)

javascript jquery internet-explorer

10
推荐指数
4
解决办法
4万
查看次数

如何从边缘元素偏移边框图像?

我有一个底部边框图像,应该比元素的实际边缘低几个(比如说3个)像素.

这是我到目前为止所得到的:

<style>
h1 { background-color: green;
    border: solid transparent;
    border-width: 0 0 13px;
    border-image:url("data:image/png;base64,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") 1 1 13 1 repeat;
}
</style>

<h1>How to get a border image offset from the edge of the box?</h1>

<p>Bacon ipsum dolor sit amet tenderloin drumstick ribeye filet mignon t-bone beef ribs. Tri-tip venison turkey salami drumstick chicken pastrami. Frankfurter pork jowl ball tip tail.</p>
Run Code Online (Sandbox Code Playgroud)

或者参见JS Fiddle:http://jsfiddle.net/BDbX2/1/.

如何让边框图像稍微低一些,以便元素的绿色背景不会从边框图像后面窥视?

这是一个屏幕截图,显示了我正在寻找的更多信息:

这是一个屏幕截图,显示了我正在寻找的更多内容

请注意,在边框上方,绿色是可见且不间断的.但我不希望绿色出现在边界下方.

我正在使用Firefox; 当然,我更喜欢在多个(最新版本)浏览器中运行的解决方案.

html css css3

10
推荐指数
3
解决办法
3850
查看次数

使用具有智能布局和间距的罗盘生成精灵

我正在尝试使用SASS Compress生成一些精灵,我想将智能布局应用于sprite文件,如文档http://compass-style.org/help/tutorials/spriting/sprite-layouts/

这非常有效:

$sprites: sprite-map("sprite/*.png", $spacing: 20px);
Run Code Online (Sandbox Code Playgroud)

但是当我添加布局时,它会中断; 没有间距,没有智能布局:

$sprites: sprite-map("sprite/*.png", $layout: smart, $spacing: 
Run Code Online (Sandbox Code Playgroud)

如何将智能布局应用于生成的精灵?

更新 一段时间后我开始工作了:

$sprite-spacing: 20px;
$sprite-layout: smart;
@import "sprite/*.png";
@include all-sprite-sprites;
Run Code Online (Sandbox Code Playgroud)

但现在我无法让间距发挥作用.精灵很聪明但没有间距.

compression sass sprite css3

10
推荐指数
1
解决办法
4548
查看次数

如何仅在一侧使用边框图像?

我有一个图像,我想将其设置为元素的边框,但仅作为底部边框: 边界图像 < - 太小了 - 但它就在那里.

这是我到目前为止所得到的:

<style>
body { margin: 0; padding: 10px; }
    h1 {
background-color: red;
    border: solid transparent;
    border-width: 2px;
    border-image: 2 repeat url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAADCAYAAACqPZ51AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAB9JREFUeNpiZGBgOMOABv7//48uxMDEQCQgWiFAgAEAjqADz4EvP7IAAAAASUVORK5CYII=");
}
</style>
<h1>Bacon</h1>
<p>Bacon ipsum dolor sit amet tenderloin drumstick ribeye filet mignon t-bone beef ribs. Tri-tip venison turkey salami drumstick chicken pastrami. Frankfurter pork jowl ball tip tail.</p>
Run Code Online (Sandbox Code Playgroud)

或者参见JS Fiddle:http://jsfiddle.net/eqpt5/.

正如您所看到的,这会将边框图像放在顶部和底部(以及两侧 - 尽管您看不到它).如何在底部使用边框图像border-image

html css css3

9
推荐指数
1
解决办法
2万
查看次数

使用JavaScript(appendChild)将新元素添加到DOM中

我有时需要向现有的HTML页面添加元素(例如新的链接和图像),但我只能访问远离我需要插入元素的页面的一小部分.我想使用基于DOM的JavaScript技术,我必须避免使用document.write().

到目前为止,我一直在使用这样的东西:

//  Create new image element
var newImg = document.createElement("img");
  newImg.src = "images/button.jpg";
  newImg.height = "50";
  newImg.width = "150";
  newImg.alt = "Click Me";
//  Create new link element
var newLink = document.createElement("a");
  newLink.href = "/dir/signup.html";
//  Append new image into new link
newLink.appendChild(newImg);
//  Append new link (with image) into its destination on the page
document.getElementById("newLinkDestination").appendChild(newLink);
Run Code Online (Sandbox Code Playgroud)

有没有更有效的方法可以用来完成同样的事情?这一切似乎都是必要的,但我想知道是否有更好的方法可以做到这一点.

javascript dom

8
推荐指数
2
解决办法
3万
查看次数

更改SASS的sass-cache位置

我看到的文档中,您可以更改SASS缓存的位置.

但是,我不确定要使用的确切语法.我有一个Zurb基金会项目,然后有一个config.rb文件.我假设需要更新以更改缓存文件的位置.

需要在此文件中放置缓存的正确设置是什么?我希望它驻留在c:\temp(我在Windows环境中).

sass zurb-foundation

8
推荐指数
1
解决办法
1151
查看次数