' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%232aabee'/%3E%3Cstop offset='1' stop-color='%23229ed9'/%3E%3C/linearGradient%3E%3Ccircle cx='120.1' cy='120.1' r='120.1' fill='url(%23a)' fill-rule='evenodd' clip-rule='evenodd'/%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M54.3 118.8c35-15.2 58.3-25.3 70-30.2 33.3-13.9 40.3-16.3 44.8-16.4 1 0 3.2.2 4.7 1.4 1.2 1 1.5 2.3 1.7 3.3s.4 3.1.2 4.7c-1.8 19-9.6 65.1-13.6 86.3-1.7 9-5 12-8.2 12.3-7 .6-12.3-4.6-19-9-10.6-6.9-16.5-11.2-26.8-18-11.9-7.8-4.2-12.1 2.6-19.1 1.8-1.8 32.5-29.8 33.1-32.3.1-.3.1-1.5-.6-2.1-.7-.6-1.7-.4-2.5-.2-1.1.2-17.9 11.4-50.6 33.5-4.8 3.3-9.1 4.9-13 4.8-4.3-.1-12.5-2.4-18.7-4.4-7.5-2.4-13.5-3.7-13-7.9.3-2.2 3.3-4.4 8.9-6.7z' clip-rule='evenodd'/%3E%3C/svg%3E)
@Злой_Полицейский — авторский канал вашего покорного слуги в Telegram, где я пишу заметки о веб-разработке, программировании, PHP, инструментах и WordPress.
13 лет назад,
комментариев 41
Время для прочтения: 0 мин. 0 сек.
У меня не работает для border-top-right-radius, border-bottom-right-radius, т.е. если делаю скруглённые углы для всех, то работает, как только задаю для двух углов не работает,так и есть, или что-то не так делаю?
Пример увидеть можно? Потому как у меня работает в любой вариации углов.
да, вот примерчик http://nadena.ru/kr/, меню на жёлтом фоне, должны быть скруглены только верхние углы
У вас в IE вообще хоть какие-то углы скругляются?
да, на ссылках выше как раз сделаны скруглённы уголки с помощью этого htc
а вы, кстати не покажете демо пример, именно не со всеми углами, а несколькими, я сравню, может пойму в чём дело?
Навскидку не скажу. Посмотрите здесь.
UPD: извинюсь, там использую другое решение — DD_roundies.
У них на сайте есть пример с табами. Насколько я помню у них задание углов для скругление возможно только одной строкой, типа так:
У вас же задано немного неверно:
Спасибо большое! Видимо всё таки не работает под разные углы, так как с табами у них просто перекрывается нижним блоком и закрываются уголки нижние, ну ладно, тоже тогда так сделаю, хотя жалко, хороший скриптик
См. коммент выше
ой, да, спасибо! Это я такая внимательная, точно, просто нужно сокращённую запись использовать, отлично, всё работает! Спасибо ещё раз!!
Собственно, не за что.
да, я так бы и мыкалась, что называется, смотрю в книгу, и не вижу ничего :)), так что помощь нужная, спасибо ещё раз! Если что можно удалить эту ветку.
Интересно, а что Oper’у стороной обошли с градиентом, по-моему у нее есть свойства CSSградиета да и файл PIE.htc — это же javascript инструкции. Не проще ли jQery эффекты подключить?
На момент создания скрипта Опера не поддерживала CSS градиенты (исключение SVG).
Зачем тянуть целый фреймворк jQuery для получения какого-либо эффекта?
Не совсем по теме вопрос (вопрос по свойству
border-radius), может сталкивались с таким, нужно смотреть в опере или хроме, баг в картинках с серым бордером скруглённым, сами углы почти не видны. Свойствоborder-radiusприменено кimg, у которых стоитborder.Видел подобную проблему. Совет: использовать
border-radiusне для тегаimg, а для —div, содержащий эту самую картинку.Спасибо! Мне тоже такая идея приходила в голову, но эффект был тот же, но попробую ещё раз!
Можно положить картинку фоном на слой, у которого скруглены углы. Подробнее.
Здравствуйте! У меня почему-то градиент применился, а тень и скруглённые уголки нет. В чём может быть причина? Спасибо.
Использую IE8.
Желательно пример ваш увидеть — так трудно сказать.
Что-то не получилось вставить весь код. Как вставить его нормально? В теги code можно оборачивать?
#inputJSCal { background-color: #fff; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(0.5, white)); background-image: -webkit-linear-gradient(center bottom, #eeeeee 0%, white 50%); background-image: -moz-linear-gradient(center bottom, #eeeeee 0%, white 50%); background-image: -o-linear-gradient(top, #eeeeee 0%,#ffffff 50%); background-image: -ms-linear-gradient(top, #eeeeee 0%,#ffffff 50%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); background-image: linear-gradient(top, #eeeeee 0%,#ffffff 50%); -webkit-border-radius: 4px 0 0 4px; -moz-border-radius : 4px 0 0 4px; border-radius : 4px 0 0 4px; border: 1px solid #aaa; border-right: none; height: 26px; width: 200px; line-height: 26px; padding: 0 0 0 8px; color: #666; font-size: 13pt; font-family: "Times New Roman", Times, serif; font-style: italic; font-weight: bold; behavior: url(Components/Components/CSS3PIE/PIE.js); }Смущает строка
url(Components/Components/CSS3PIE/PIE.js);. По идее там должен быть путь к htc файлу. Возможные неполадки смотрите тут.Строку подправил, js заменил на htc. Ничего не изменилось. Рядом с html файлом положил .htaccess со строкой «AddType text/x-component .htc», но всё равно ничего не изменилось, кроме того, что у поля исчезли бордюры.
Подключать же файл PIE.htc в теге head не нужно?
Подключать ничего более не нужно. Путь в behavior проверили? Через консоль браузера смотрели? Бордеры отваливаются после подключения HTC? Если да, то попробуйте дать этим элементам hasLayout (например, zoom: 1). И попробуйте на время отключить фильтр для ИЕ.
Путь проверил (через «средства разработчика») — всё в порядке
behavior: url(PIE.htc);Zoom: 1 в CSS добавил, но пока без толку.
И фильтр-фишинг отключен
Я имел ввиду
filter: progid. Бордеры отваливаются после подключения HTC? Или без него тоже самое? На локальной машине смотрите или на сервере?Отключил
filter— заработало. Спасибо. На локальной машине делаю. Каким образом фильтр влияет на css3pie? Спасибо ещё раз.Для задания градиента используйте
-pie-background(линк)И градиент исчез.
background-image: linear-gradient(top, #cccccc 0%,#eeeeee 60%);теперь не действует. Как исправить?Смотрите пруфлинк — там есть примеры и проблемы и их решения.
Спасибо.
Скажите, пожалуйста, а Вы применяете css3pie в своих проектах и как часто?
Применяю, но не часто. В основном использую DD_belatedPNG и DD_roundies.
И ещё: как в комментах код обрамлять, чтобы был в тексте на сером фоне?
Для этого есть тег
<code>...</code>Скажите, пожалуйста, css3pie поддерживает внутреннюю тень
box-shadow: inset? У меня в IE8 только внешняя отображается.В данный момент не поддерживает, но в планах есть.
Спасибо.