Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 105
О некоторых плагинах знал, но лень было ставить. Теперь у меня полный набор. Спасибо.
Не понял прикола с домашним заданием. Сложно положить индивидуальный background в угловые ячейки?
Она должна быть универсальной. Прописанной в css. Так-то собрать не сложно.
А какая универсальность может быть у угловых ячеек? Они всегда будут в углах, они не будут меняться друг с другом. Может вы что-то не договариваете, но по тем условиям, что есть, ничего сложного не вижу.
Как в css прописать стиль конкретно для угловых ячеек. Там нельзя этого определить. Либо стиль на все ячейки, либо ни на какие. в Css3 есть :last-child например, это же ближе к истине.
Ах вы про это? А зачем такие загоны, я имел ввиду, что у каждой будет свой класс, неужели это сложно сделать.
> А зачем такие загоны
Во! это и нужно было знать. Голосование вроде в посте проводить нельзя, но было бы интересно. Обычно дизайнеры видят больше, по своему избирательному вниманию и ценят мелочей больше. А если монитор с завышенным контрастом, то многие даже не поймут о чем идет беседа.
Во! это и нужно было знать. Голосование вроде в посте проводить нельзя, но было бы интересно. Обычно дизайнеры видят больше, по своему избирательному вниманию и ценят мелочей больше. А если монитор с завышенным контрастом, то многие даже не поймут о чем идет беседа.
Решение от дизайнера m_d:
jsfiddle.net/LCBFk/
Цитата:
>> Косяком является то, что нужно обернуть в div. Но если отказаться от теней, то получится вполне фэншуйный вариант, вместо div можно использовать псевдокласы ::after и ::before.
P.S. Мопед не мой, я просто разместил объяву.
jsfiddle.net/LCBFk/
Цитата:
>> Косяком является то, что нужно обернуть в div. Но если отказаться от теней, то получится вполне фэншуйный вариант, вместо div можно использовать псевдокласы ::after и ::before.
P.S. Мопед не мой, я просто разместил объяву.
tr:first-child td:last-child { background: url()}
и варьяции
и варьяции
Полностью согласен. Даже если использовать свойства CSS3, не во всех браузерах данная комбинация будет работать. А с уникальными классами ячеек — наверняка.
Почему бы не положить таблицу в div, которому задать тень в углу? Правда, вопрос фактуры самих ячеек не решается, но, возможно, удастся пошаманить с position и z-index?
Multiple backgrounds для всей таблицы + css3pie для IE
Я бы ещё предложил Firecookie(удобная работа с печеньками), CSS Usage(неиспользуемы на странице css стили), User Agent Switcher(смена информации в заголовках о UserAgent) и Quick Locale Switcher(смена информаии о языковых установках).
Набор стандартный, но пост очень круто оформили )
Разработчики со стажем находят для себя новое. Для меня он такой же стандартный, но он до сих пор ни кем не определен. Вот я и попробовал в этом все собрать, благо место позволяет.
Ну во-первых это далеко не первый пост на Хабре про набор веб-девелопера.
А во-вторых скорее всего минусуют за «Павлика» :)
А во-вторых скорее всего минусуют за «Павлика» :)
Сейчас пост читают все подряд, и кому не интересен — те минусуют. Думаю скоро подтянутся web-девелоперы и исправят ситуацию.
jquery
$('tr:first th:first').css({});
и т.д., а за подборку спасибо!)
$('tr:first th:first').css({});
и т.д., а за подборку спасибо!)
Копипастишь CSS из фаербага в Notepad++?
Такой подход в принципе не годится, потому что Firebug выкусывает все не-файерфоксовские стили. Не говоря уже о том, что нарушает и пробелы, и последовательность объявлений правил. Как работа с прекцией стилей на Firefox — да, отлично работает.
Чем можно посмотреть event-ы у элементов, если они добавляются с помощью JS после загрузки страницы?
Оформление и стиль подачи порадовали конечно )
Из того, что я бы еще добавил:
Fireshot (или его аналог) — довольно часто надо делать скриншоты области экрана, чтобы показать или клиенту, или ПМу или еще кому
Console² — Апгрейд к JS-консоли
firefontfamily — дополнение к Firebug, подсветка акутального font-family
dummy lipsum — быстрая генерация lorem ipsum текста
Из того, что я бы еще добавил:
Fireshot (или его аналог) — довольно часто надо делать скриншоты области экрана, чтобы показать или клиенту, или ПМу или еще кому
Console² — Апгрейд к JS-консоли
firefontfamily — дополнение к Firebug, подсветка акутального font-family
dummy lipsum — быстрая генерация lorem ipsum текста
Кстати, для скриншотов есть стандартная утилита в Windows 7 (я подозреваю, что не все сидят на винде, но многие). Называется Snipping Tool. Вызвать можно начав набирать в пуске в строке поиска.
Да, полезная штука, но на сколько я помню, там можно только сохранить скриншот себе файлом или выслать кому-то на мыло. Если бы она хостила этот скриншот куда-нибудь в облако и давало на него короткую ссылку — цены бы не было.
Могу предложить как вариант программку для винды jetscreenshot.com/demo-video.php.
1. Делаем скриншон (програмка вешается на любой хоткей, например на клавишу принтскрин)
2. Открывается рабочая область, где мы можем рисовать анотации (стрелочки всякие)
3. Нажимаем расшарить и скриншот автоматом заливается на фтп сервер. (на какой указывается в настройках).
4. Урл к скриншоту уже хранится в буфере обмена. Осталось только вставить его куда нужно.
Очень удобно
1. Делаем скриншон (програмка вешается на любой хоткей, например на клавишу принтскрин)
2. Открывается рабочая область, где мы можем рисовать анотации (стрелочки всякие)
3. Нажимаем расшарить и скриншот автоматом заливается на фтп сервер. (на какой указывается в настройках).
4. Урл к скриншоту уже хранится в буфере обмена. Осталось только вставить его куда нужно.
Очень удобно
Это делает кроссплатформенный сервис pix.am
Ну, это делает куча сторонних сервисов, просто было бы круто, если бы нативные средства ОСи могли бы так уметь )
а за ссылку спасибо, надо попробовать и этот
а за ссылку спасибо, надо попробовать и этот
Удобная штука. Но 1 момент смущает: можно сделать как-нибудь, чтобы URL в буфер копировался, а не открывался в браузере?
Я лишь пользователь, этот вопрос нужно задать их разработчикам, которые, к слову, должны быть на хабре, если я не ошибаюсь.
И, кстати, в версии для Мака скриншот не открывается сразу, а появляется лишь уведомление, содержащее url, при клике на котором и происходит открытие.
И, кстати, в версии для Мака скриншот не открывается сразу, а появляется лишь уведомление, содержащее url, при клике на котором и происходит открытие.
Воспользуйтесь petromi.com
Там еще и простенький редактор есть. Впрочем, он почти везде есть.
Там еще и простенький редактор есть. Впрочем, он почти везде есть.
я бы таблицу саму трогал по-минимуму, а обернул бы ее в див, и там бы спозиционировал абсолютнно блоки с декорами краев.
Добавлю еще MeasureIt — совершенно незаменимая вещь. Кстати, есть и для Хрома.
Есть более безопасный, но ограниченный способ передавать изменения стилей из фаербага: плагин для всех IDE от JetBrains — CSS-X-Fire. При изменении стилей в фаербаге в IDE появляется кнопочка для принятия изменений.
Я бы добавил ещё FireQuery для работающих с jQuery -_-
Наш верстальщик предлагает такое решение
«обернуть таблицу в div и в ней с помощью css3 разместить сразу 4 фоновых изображений с соответствующим позиционированием в процентах (css3 поддерживает множество фоновых картинок сразу в одном диве) плюс также и общий цвет фона.»
«обернуть таблицу в div и в ней с помощью css3 разместить сразу 4 фоновых изображений с соответствующим позиционированием в процентах (css3 поддерживает множество фоновых картинок сразу в одном диве) плюс также и общий цвет фона.»
Для работающих с ExtJS есть прекрасное расширение Illuminations: отображает объекты ExtJS, со всеми их атрибутами, методами, событиями и т.д.
как бэ это понятно но -> habrahabr.ru/post/142277/#comment_4765206
Частично правильно, но нет, потому что habrahabr.ru/post/142277/#comment_4766582
так лучше?
>Это Джастин Бибер в мире попсы
Кто это? Википедия подсказывает, что это какой-то подросток, взятый с ютуба в 2008-м. Куча каких-то немузыкальных наград. Он петь-то умеет или только улыбается на камеру?
Кто это? Википедия подсказывает, что это какой-то подросток, взятый с ютуба в 2008-м. Куча каких-то немузыкальных наград. Он петь-то умеет или только улыбается на камеру?
Он сейчас как Ранетки в остальном мире.
Дубль два — кто такие Ранетки?
Телевизор не смотрю, сорри :-) А по радио такого почему-то не крутят. Хотя я не ограничиваюсь какими-то радиостанциями, а скачу по FM-диапазону туда-сюда, избегая рекламы и диджейской болтовни. Но ни Ранеток, ни этого Бибера не слышал — возможно, повезло?
Ладно, извиняйте за затянувшийся оффтопик, просто фраза из поста зацепила внимание.
Телевизор не смотрю, сорри :-) А по радио такого почему-то не крутят. Хотя я не ограничиваюсь какими-то радиостанциями, а скачу по FM-диапазону туда-сюда, избегая рекламы и диджейской болтовни. Но ни Ранеток, ни этого Бибера не слышал — возможно, повезло?
Ладно, извиняйте за затянувшийся оффтопик, просто фраза из поста зацепила внимание.
Помимо Firepicker и Stylizer есть еще, как минимум, ColorZilla. Удобная такая пипетка.
Кстати, в том же духе, еще можно размеры линейкой замерять — MeasureIt.
Кстати, в том же духе, еще можно размеры линейкой замерять — MeasureIt.
А разве вкладка Net в Firebug не показывает скорость загрузки и кол-во запросов? Советов правда не выдаёт.
Ещё есть хорошие линейки foxguide
Еще полезная штука это ShowIP. Когда рабочих проектов много и они порой размазаны по ряде компов на доменах, которые не всегда корректно резолвятся или же что-то даже крутиться локально, нужно быть уверенным, что смотришь именно тут, что правишь в редакторе.
Я очень люблю и постоянно использую расширение CSS Reloader, у которого только одна функция перезагружать CSS сайта без перезагрузки страницы. Очень удобно перезагружать только CSS когда
1) вся страница долго грузится (ну и вообще CSS грузится почти всегда намного быстрее чем вся страница).
2) когда менялся HTML (DOM) в Firebug, и нажатие F5 бы удалило эти изменения.
3) когда нужно потестировать какое-то состояние страницы, к которому нужно дойти за несколько кликов после F5 (типа открытый список, форма с ошибками, модальное окно).
1) вся страница долго грузится (ну и вообще CSS грузится почти всегда намного быстрее чем вся страница).
2) когда менялся HTML (DOM) в Firebug, и нажатие F5 бы удалило эти изменения.
3) когда нужно потестировать какое-то состояние страницы, к которому нужно дойти за несколько кликов после F5 (типа открытый список, форма с ошибками, модальное окно).
Да, забыл еще 2 полезных расшрирения: JSONView (JSON ответ от сервера будет не только раскрашен, но можно и сворачивать/разворачивать вложенные структуры) и User Agent Switcher для быстрого переключения user agent (больше нужен что бы посмотреть как реагирует сервер на разные агенты, в духе вывода надписи «обновите браузер»).
Обидно за сравнение бибера с Firebug.
еще есть хорошая штука livereload, полезна при верстке для автоматической перезагрузки страницы в браузере после изменения файлов, к аддону FF нужно еще запустить сам gem livereload в корне сайта, есть модули для популярных цмс, для друпал точно есть, с удовольствием им пользуюсь.
Из всего вышеперечисленного я не пользовался только Firepicker'ом. Colorzilla как-то всегда устраивала, сейчас поставлю и сравню.
В моей коробочке еще Yslow и HTML Validator
Последний правда пока как-то не так хорош для HTML5, как для более старых версий
Последний правда пока как-то не так хорош для HTML5, как для более старых версий
Мой вариант: http://jsfiddle.net/z8TNu/
Не удалось избавиться от обертки вокруг таблицы :(, но нужен только 1 дополнительный div.
Не удалось избавиться от обертки вокруг таблицы :(, но нужен только 1 дополнительный div.
Кажется, вы куда-то не туда дали ссылку.
Ох, забыл сохранится :( И вариант только на домашней системе.
Вариант без дополнительных элементов. Только таблица:
http://jsfiddle.net/p3nej/5/
Минус — добавляется граница, которую можно убрать отрицательным отступом.
http://jsfiddle.net/p3nej/5/
Минус — добавляется граница, которую можно убрать отрицательным отступом.
огромное спасибо за cssUpdater
web developer использую года три точно. Без него было бы туго.
Да как же я раньше жил без половины этих аддонов?! Автору большое спасибо!
Ещё добавлю HTTPFox. Это простой аналог HTTPWatch. Конечно можно и в FireBug смотреть, но в HTTPFox удобнее.
Я бы добавил IE Tab addons.mozilla.org/ru/firefox/addon/ie-tab-plus/
А я без PixelZoomer теперь не могу верстать.
А есть подобно cssUsage только для html?
Я бы еще добавил MeasureIt для измерения деталей на страничке и Flagfox. Flagfox кроме приятной возможности видеть флаг страны в которой находится сервер открытой странички дает быстрый доступ к полезным функциям как whois, Ip ресурса, страничка ресурса на Alexa и многое другое
К слову, половину из этого я и так использую.
Еще использую:
Firefinder for Firebug
FlashFirebug
FireQuery
Inline Code Finder for Firebug
Хорошая статья. Добавил в избранное.
Еще использую:
Firefinder for Firebug
FlashFirebug
FireQuery
Inline Code Finder for Firebug
Хорошая статья. Добавил в избранное.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Возьми от Firefox все для веб-разработки