Jump to content

ows.nightwolf

User
  • Posts

    125
  • Joined

  • Last visited

  • Days Won

    9

Everything posted by ows.nightwolf

  1. Да, соглашусь с Justnewone, судя по резальтатам этого обсуждения можно сделать выводы: 1. Определить какой способ выборки более производителен сложно, т.к. для различных селекторов он отличается, в зависимости от браузера. 2. В пределах одного браузера отличие между скоростями вборки по ID и Class незначительное. 3. Количество операций выборки в секунду и для ID и для class настолько велико, что едвали найдется реальная прикладная задача где будет необходимость задумываться над тем какой способ выборки применить. 4. Как бы то нибыло, следует разделять CSS и JS просто для упрощения внесения изменений в разрабатываемый проект. Если в JS используется выборка по классу, то выбираемым элементам рекомендуется назначать отдельный класс с приставкой "js-" (опять же, для того чтобы отделить классы оформления от классов для скриптов).
  2. Мне, для визуального удобства, необходимо сделать margin-right: 25px; для первого h3. Для второго h3 подобное делать необходимо. Выходит, чтобы описать стиль мне необходимо давать первому h3 идентификатор и писать для него стиль, либо же описать style прямо в теге для данного определенного случая. Тоже самое касается и <div style="margin-top: 10px;">. Как поступают в данных ситуациях опытные верстальщики? Нужно идентифицировать и в CSS это описывать? Я не опытный верстальщик Я так понял margin-right задается чтобы input'ы были визуально "в одной колонке"? в таком случае лучше теги <input> в HTML разметке поставьте перед <h3>, а самим инпутам дайте в стилях свойства: float: right;margin-left: ___px; /*(возможно и не понадобится)*/Тогда сколько бы у вас там полей для ввода ни было, они всегда будут по правому краю выровнены, а текст - по левому. И используйте какой ни будь reset.css чтобы сбросить стили браузера по умолчанию (например, normalize). А на счет margin-top - я бы всеравно в css файл выносил. И еще - вместо тега <h3> тут гораздо лучше бы подошел тег <label>
  3. Уберите из HTML разметки CSS свойства (в атрибутах style) и перенесите их в css файл т.к. по возможности стоит разделять разметку, стили и скрипты. Применение атрибута style оправдано только для очень спецефического/непостоянного контента (например какая ни будь картинка в статье) из соображений что если вам понадобиться ее удалить, то вы просто удалите HTML код относящийся к ней и этого будет достаточно, не нужно будет лезть в css файл и там удалять свойства этой картинки. У вас же стили задаются основным блокам страницы, которые универсальны (показываются на всех страницах) и неизменчивы (маловероятно что вы будете их в будущем удалять), т.е. рекомендуется все свойства относящиеся к ним держать в css файле.
  4. Теоретически должно зависеть от браузера, у firefox и webkit-based браузеров разные способы кеширования результатов поиска.
  5. Если есть возможность можете сделать картинку в формате svg и назначить на элементы самой картинки ссылки. Примитивный пример работы с ссылками в svg тут. Это жестко привяжет ссылки к картинке как бы вы ее там не деформировали. Но решение нестандартное, я так делать никогда не пробовал, по этому о побочных эффектах тоже ничего сказать не могу.
  6. Заключите тело каждой из функций в фигурные скобки. Согласно действующему стандарту тело функции всегда должно заключаться в скобки, даже если оно состоит всего из одного выражения. То что написано у вас работает только в FF т.к. данный синтаксис объявления функции является частью предложенного мозилой расширения к языку (подробнее тут).
  7. Можете попробовать плюс сделать псевдоэлементом не у span'а, а у самого li, тогда разметка останется такой какая есть сейчас, и не будет излишних тегов-оберток.
  8. Вариант от npofopr в IE 11 работает, попробуйте очистить кеш у IE, у меня такое пару раз было - изменения в файл внес, а IE его не обновлял.
  9. Не могу так с ходу придумать как по русски правльно обозвать этот процесс, но в общем в скорости нахождения этого элемента. Ну например если сравнить селектор с большой вложенностью и единичный селектор, то единичный будет обрабатываться быстрее. ( .class быстрее чем div.class > child ). Аналогично id обрабатывается быстрее чем class (источник - в спойлере). Если мне не изменяет память я когда-то где-то читал что создавая элементы с id браузер каким-то образом у себя их отмечает, что позволяет ему найти нужный элемент без необходимости перебора всего дерева объектов, за счет этого и достигается большая производительность, но эта информация непроверенная.
  10. Использование идентификаторов в качестве селекторов нежелательно, т.к. это исключает возможность повторного применения этих стилей к другому элементу. Кроме того, идентификаторы часто находятся в распоряжении JS скрипта, и если в будущем программисту вдруг вздумается поменять идентификатор элемента на другой, то верстка повалится, надо будет лезть еще и в CSS подправлять, что не есть настоящий дзен. Единственным объективным преимуществом id перед классом является бóльшая производительность, но это экономия на спичках.
  11. Вау! спасибо, parfait очень удобная вещь на первый взгляд. очень удобно образмеривать все.
  12. На сколько я понял, вам нужно быстро получить значения top / left и width / height этих элементов чтобы вручную их самому не считать. Могу предложить такой вариант: сгруппируйте в фотошопе слои с маркерами, потом кликните правой кнопкой мыши на группе и выберите Copy CSS (не знаю как на русский перевели, видимо "копировать CSS", ваш кэп ). Я думаю что делать дальше вы разберетесь, но на случай если кто ни будь из новичков наткнется на этот пост под спойлером описан порядок дальнейших действий.
  13. Так что же они всетаки ответили?)
  14. Используйте одинарные кавычки: title="{short-story limit='200'} А вот <hr> в атрибут вставить не получится, этот тег будет написан обычным текстом
  15. либо вариант без обертывания в дополнительный div, но работает в IE9+: left: 50%;transform: translateX(-50%);
  16. Я не уверен, но помоему тот скрипт что вам дали как раз делает то что вам нужно. На странице вым дается форма, в которой вы указываете путь к своей картинке, потом в этой форме вы жмете кнопку "отправить", картинка посылается на сервер. На сервере PHP скрипт ее принимает, сохраняет, а вам в браузер отправляет текст HTML кода для этой картинки - а именно: <a href=http://домен/имя картинки'><img src='http://домен/имя картинки'></a>. Если вам не нужно HTML представление кода картинки, а только ее адрес на сервере, то в команде echo вместо html кода вставите чтоб сервер отдавал только адрес этой картинки. Единственное что в этом скрипте не генерируется рандомное название для вашей картинки для сохранения, если я не ошибаюсь.
  17. Иными словами создаем <div>, задаем ему нужную ширину и высоту, вставляем иконку в фон и этот блок превращаем в ссылку. Так я понял? Да, кроме того что создавать надо не тег <div> а тег <a> (обычная ссылка). http://jsbin.com/zadoyiti/1/edit
  18. В дополнение к Sergik+: и тогда для такой ссылки надо задать свойства display: inline-block, width и height. Ваш кэп
  19. А разве есть такая команда - border-image: linear-gradient(to bottom, #6ca8c1, #7cc1d9, rgba(0, 0, 0, 0)) 1 100%;?Синтаксис же вроде : border-image: none | [ <URL> [<число> | <проценты>]{1,4} [/ <толщина>{1,4}]? ] && [stretch | repeat | round]{0,2} Согласно спецификации свойство border-image (п. 6.7) в одном из своих параметров устанавливает свойство border-image-source, которое в свою очередь может принимать своими значениями типы none и <image> (п. 6.1). В свою очередь тип <image> (п. 3) может принимать значения таких типов как: <url> | <image-list> | <element-reference> | <gradient> т.е. градиент можно применять во всех свойствах, которые ожидают в качетсве своего значения тип данных <image>. В дополнение отрывок из того же пункта спецификации: Переводится примерно как: Тип <image> может быть использован в множестве CSS свойств, включая свойства ‘background-image’, ‘list-style-image’, ‘cursor’ (где он замещает <url> компонент в значении свойства). По поводу вашей задачи - вот так вот вроде бы должно работать в современных браузерах, но проверить у меня пока возможности нету (система только что установлена). У меня FF nightly - все отображается корректно. http://jsbin.com/rusicoze/1/
  20. По теме (просто мое мнение): в данном случае из спецификации похоже ничего не выудишь. Если руководствоваться логикой, то тоже двоякое решение: с одной стороны перечеркивание старой цены используется как маркетинговый ход для визаульного воздействия на покупателя (как минимум чтоб он увидел выгодную разницу между старой ценой и новой), т.е. относится к визуальному оформлению, т.е. должны использоваться стили CSS; с другой стороны имеет место быть семантическая разметка, когда старая цена была исправлена (<del>) на новую (<ins>). Но тем не менее мне больше симпатизирует CSS стиль т.к. в моем понимании тег <del> используется именно для постоянных исправлений (измененные пункты контракта, списков и т.д.), а цена по истечении срока акции вернется к своему первоначальному значению. Не по теме: продолжая мысль Great Rash можете еще псевдоэлементы добавить чтоб уж наверняка все перечеркнуть
  21. Как вариант вместо <br> задать в CSS для картинки свойство display: block
  22. Спасибо, интересную тему создали Только я не понимаю необходимости в max-width. Я убрал ее из скрипта - вроде все работает как надо: http://jsfiddle.net/KT5TC/16/
  23. "Новый сервер". Город Минск.
  24. CSS'ом вроде не сделать, т.к. треугольник делается с помощью свойства border, а при назначении этому border'у градиента (через свойство border-image: linear-gradient(...) ) назначенный градиент будет иметь приоритет перед цветом transparent у border'ов справа и слева и "эффект треугольника" пропадет.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy