Comments 55
UFO landed and left these words here
Насколько я понял, все эти методы представляют решение основанное на графике. А может быть есть способ сделать круглые кнопки без использования картинок?
иногда картинки весят даже меньше чем такое же решение на html - нужно будет использовать слишком много лишних тегов
Оно конечно так, но в приведенных примерах отключение графики (или недогрузка картинок) превращает кнопки в обычные тексты. К тому же решения на js тоже не фонтан, если меру потерять и все дизайнерские изыски перевести на js.
ну, не совсем так, в большинстве случаев авторами это просто не предусматривается. но например в статье про кнопку яндекса, при отключении графики, кнопка не теряет внешнего вида, хоть она и становится квадратно, но всеровно на своем оранжевом фоне и т.д., т.е. вы можете сами предусматривать такую возможность.
Есть, примерно такой-же как сделать таблицы с закругленными краями без графики, слишком много кода получается, так что это того не стоит. Ждем CSS3 )
Графика для стандартных элементов интерфейса — зло.

a.button-link{
padding:8px 12px;
border-top:1px solid #d3cbad;
border-left:1px solid #c9c09c;
border-bottom:1px solid #817354;
border-right:1px solid #998c68;
background:#beb388;
}
никто же вас не заставляет использовать ее. для ссылок вполне сгодится
Можно, и даже одним атрибутом CSS...
Да вот то, что это работает тоько в Mozilla/Safari, сводит все на нет...

Mozilla: -moz-border-radius: 1em;
Safari: -webkit-border-radius: 1em;
можно например так http://www.cssplay.co.uk/boxes/krazy.html
хоть это и не кнопки но приспособить нет проблем
UFO landed and left these words here
Какой-то сегодня особо плодотворный день на хабре. Много всего полезного. :)
Нашел вот у firefox свойство -moz-border-radius - позволяет делать круглые края, но только в firefox (а жаль :(), вдруг кому пригодится
UFO landed and left these words here
Собственно, трудно себе представить, что когда-то (лет через 20) "мега-консорциум" обяжет всех браузеростроителей внести "унификации по оформлению кнопочек"...
UFO landed and left these words here
UFO landed and left these words here
внутренний тег style тоже имеет преимущества. и табличная верстка тоже иногда полезна. просто все нужно делать с умом )
UFO landed and left these words here
UFO landed and left these words here
Ну никто же вас не заставляет все делать по другому, я тоже соглашусь что тег style не стоит вставлять в код когда вы верстаете, но от стандартных типа b и т.д никто вас не убеждает уходить. Не воспринимайте чужую точку зрения в штыки и все у вас будет хорошо.
А при использованных стилями тормозят? Не смешите.
Как верстать - выбор каждого. Просто кто-то делает правильно(с грамотным подходом, в данном случае, это блочная верстка), а кто-то, как ему заблагорассудится.
вы бы вочитали что нибудь умное перед тем как утверждать такое
UFO landed and left these words here
хоть я и сторонник минимализма всё равно спасибо, понадобиться.
Естественно, в закладки!
На мой взгляд, наиболее интересная статья — Владимира Токмакова из Техногрета
Ну я один раз использовал при верстке, в действительности достаточно сложно но реализовать пнг кнопку с возможностью расширения пока не получилось...
"Простае круглые кнопки с помощью CSS (Wii Buttons)" — в первом слове опечатка.
По-моему, везде, где используется метод "раздвижных дверей" и, как следствие - "Минусы: два файла картинок" - можно пользоваться и одним файлом, немного подправив стилевой файл.

По сути, это будет частный случай недавно описанной мною техники "резиновых" кнопок http://habrahabr.ru/blog/webdev/45884.ht… - только там кнопка во все стороны тянулась, а не только в горизонтальном направлении.
В обзоре есть статьи где используется по одному файлу для картинок, так же как и тянущиеся во все стороны кнопки.
По сути можно всегда обойтись одним фалом.
Практически все видел, но как сборник рецептов весьма полезно, спасибо Вам. Хорошо бы сводную таблицу сделать с количественными характеристиками разных способов...
количественными характеристиками чего? количества файлов и классов?
по-поводу кнопок Яндекса, вы несколько не правы: во-первых, там 2 картинки, во-вторых, я бы добавил к ее плюсам следующие пункты
— не зависит от размера шрифта
— быстрое создание нового скина
— не зависит от фона на котором лежит
— при отключенных\недоехавших картинках белая ссылка будет на нужном фоне (в данном случае оранжевом)
Only those users with full accounts are able to leave comments. Log in, please.