我想在我的静态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上做什么才能看到罗盘进口?
我已经使用Widerbug(http://www.command-tab.com/2008/01/19/widerbug-widescreen-firebug/)在浏览器的右侧而不是在底部打开Firebug.最近我更新了我的FF,现在widebug不起作用.我安装了最新版本的Firebug,但这没有用.如何将Firebug附加到浏览器的右侧?
我正在使用Aptana Studio 3,我希望获得代码辅助功能以适用于Sass(.scss)文件.如果代码辅助不适用于Sass语法/声明,那就没问题,但是我希望获得标准CSS声明的语法突出显示和代码完成帮助.因此,例如,如果我输入"background",我希望编辑器显示与HTML相同的语法.
我为.scss文件添加了一个新的文件关联首选项(从这里:https://wiki.appcelerator.org/display/tis/Changing+your+file+association+preferences),并将CSS编辑器指定为默认值.scss文件的编辑器.这让我突出了语法,但CSS规则没有代码完成帮助.
我做错了什么,或者我只是因为获得代码完成/代码辅助帮助而运气不好?
我写了一个Web应用程序,发现当我调整页面大小时,浏览器不会显示它自己的滚动条,因为窗口缩小了.这可以防止用户访问内容.我将我的身体宽度设置为500px并将导航栏设置为white-space:nowrap.如何让浏览器识别屏幕右侧有内容?
只是为了澄清我想要浏览器的滚动条而不是任何控件上的滚动条.
我有这个脚本:
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) 我有一个底部边框图像,应该比元素的实际边缘低几个(比如说3个)像素.
这是我到目前为止所得到的:
<style>
h1 { background-color: green;
border: solid transparent;
border-width: 0 0 13px;
border-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAOCAYAAAArMezNAAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAAAQZJREFUeNrc0y1LhEEUBeDnyoIfwSzYBX+CG0Qslm0m3bhd2KBs3CSCmMxbBLGtwSKCoL9C2GYVLDZBvJZRXhZfWZEtHrjMnTNnzszc4UZmmgqK8RW2fpBt4h43aGHuG80ctnGemWYK2cI1LtGsiJuFu8U6HjGPQ7QRJdqFW8AzRGaKiPF6DMrYGeN7mXkEEbGPxcK/ZOZx4fcy87RR8/RODT9fKeFxRKyUfDSuafzxf0Z1azOmhP9v/Dap5rfGyxNolqrGZxNsGOApIg7qBBHRw3u1pWENQ+RYDMvaJ3Zxgm4WoFu4dmbKzK/Oqx68gX7J+7j75nKz2MFqmT/gIjNfI0Jm+hgA74lgEBd+SugAAAAASUVORK5CYII=") 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; 当然,我更喜欢在多个(最新版本)浏览器中运行的解决方案.
我正在尝试使用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)
但现在我无法让间距发挥作用.精灵很聪明但没有间距.
我有一个图像,我想将其设置为元素的边框,但仅作为底部边框:
< - 太小了 - 但它就在那里.
这是我到目前为止所得到的:
<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页面添加元素(例如新的链接和图像),但我只能访问远离我需要插入元素的页面的一小部分.我想使用基于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)
有没有更有效的方法可以用来完成同样的事情?这一切似乎都是必要的,但我想知道是否有更好的方法可以做到这一点.
但是,我不确定要使用的确切语法.我有一个Zurb基金会项目,然后有一个config.rb文件.我假设需要更新以更改缓存文件的位置.
需要在此文件中放置缓存的正确设置是什么?我希望它驻留在c:\temp(我在Windows环境中).
css ×4
sass ×4
css3 ×3
html ×3
javascript ×3
aptana ×1
code-assist ×1
compression ×1
dom ×1
editor ×1
firebug ×1
jquery ×1
ruby ×1
rubygems ×1
sprite ×1