Инструменты для создания спрайтов CSS? [закрытый]
Вы должны определить в своем файле app0.js путь public, откуда вы собираетесь обслуживать статические файлы. Попробуйте следующий файл app0.js, требующий модуль path и использующий express.static после bodyParser.json():
var express = require('express'),
app = express(),
bodyParser = require('body-parser'),
path = require('path')
app.set('view engine','ejs');
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
app.use(express.static(path.join(__dirname, 'public')));
app.get("/grid", function(req, res, next){
res.render("grid")
});
app.listen(3000,function(){
console.log("serving test demo on port 3000")
});
И ваш файл grid.ejs свяжите файл начальной загрузки следующим образом:
<link rel="stylesheet" type="text/css" href="/bootstrap.css">
9 ответов
Это сделает 90% работы для Вас: CSS Генератор Sprite . Необходимо будет все еще отредактировать правила сами, но инструмент даст Вам фрагменты кода, в которых Вы нуждаетесь для нового файла CSS.
Если Вам нравится Java, то можно использовать GWT 1.5 +, который идет с чем-то позвонившим" ImageBundle". Компилятор GWT обработает все противные детали для Вас. Вы не должны будете даже кодировать одну строку JavaScript или писать любой CSS.
нашел это довольно быстрое tho, что предел загрузки 500K мог бы быть болью. исходный код доступен здесь
Это выглядит многообещающим:
Также я нашел эта статья , которая имеет немного полезной информации, и даже некоторый читатель комментирует стоящий чтения.
Также, по-видимому, веб-инструментарий Google имеет что-то - поэтому при использовании этого, это могло бы стоить проверить.
Не прямой ответ, но моим поддерживающим разработчикам и веб-интеграторам, рассмотрите просто выравнивание каждого спрайта к полномочиям два; например, 16 пикселей или 32 пиксельных сетки. Это делает вычисление смещений в файле CSS намного легче. Весь пробел между не имеет значения как gifd и png сжатие форматов это очень хорошо.
Вот сценарий, который объединяет изображения с помощью сценария Photoshop в спрайты CSS . Он не будет создавать карту спрайтов, как вы просили, но он объединит изображения, кратные двум (2, 4, 8), если они одного размера. Я предпочитаю комбинировать похожие изображения (обычные, наведенные, выделенные, родительские или выбранные), чем объединять все изображения в один файл.
Теперь есть Sprite Me от Стива Содерса. Просто попробуй, и он, кажется, работает очень хорошо
Вот ссылка http://spriteme.org/ и вот сообщение в блоге, объявляющее об этом.
, если вы используете Ruby on Rails, существует простая в установке библиотека для создания спрайтов CSS.
Tonttu - это приложение на основе Adobe AIR, обеспечивающее простой интерфейс для создания мощных изображений CSS-спрайтов. Вы можете указать FiledWidth и FieldHeight или отсортировать изображения.
Создание изображений CSS-спрайтов с помощью Tonttu Desktop Tool