Перейти к содержимому


Партнерская программа Kredov

Закругление углов у div

#1 Sleepwalker

Sleepwalker
  • Пользователь
  • 202 сообщений
  • Репутация: 3
0

Отправлено 11 Октябрь 2013 - 09:02

Доброго времени суток, возможно ли у дивов делать закругленные углы?

 

 

  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85
Советую обратить внимание на следующее:
  1. Закругление углов
  2. Как создать блок со скругленными углами
  3. Блок с закругленными углами
  4. Как закруглить углы в слайдере?
  5. Закругление углов для меню

#2 Игорян

Игорян
  • Пользователь
  • 296 сообщений
  • Репутация: 10

Отправлено 11 Октябрь 2013 - 09:29

1. Пропишите класс к блоку div и придайте стиль border-radius. это простой способ, но на сколько помню он работает не во всех браузерах.
2. Нарежьте картинку с круглыми углами в фотошопе на три части верх, низ и середина. Далее нужно будет прописать класс div и придать стиль в котором и пропишите путь до нарезанных картинок. Такой способ корректно работает во всех браузерах.

P.S. гугл знает всЁ! Тема заезженная вдоль и поперек.
  • 1

#3 Sleepwalker

Sleepwalker
    Topic Starter
  • Пользователь
  • 202 сообщений
  • Репутация: 3

Отправлено 11 Октябрь 2013 - 10:55

Спасибо! а как можно сделать отступ по шире от текста до края??
{border-radius: 15px; color: #c0c0c0;  border:1px solid #f6a955;}

  • 0

#4 fedornabilkin

fedornabilkin
  • Пользователь
  • 696 сообщений
  • Репутация: 91

Отправлено 11 Октябрь 2013 - 11:39

отступ

padding:1px 2px 3px 4px;
Сверху 1, справа 2, снизу 3 и слева 4 пикселей.
Можно использовать
padding-top:1px;
padding-right:2px;
padding-bottom:3px;
padding-left:4px;

  • 1
Как часто в горестной разлуке,В моей блуждающей судьбе, ФО, я думал о тебе.


#5 Лиана Аджиева

Лиана Аджиева
  • Пользователь
  • 130 сообщений
  • Репутация: 14

Отправлено 15 Октябрь 2013 - 11:54

Все верно, но вы забыли, что разные люди пользуются разными браузерами и не все стили в разных браузерах отображаются одинаково и поэтому
.class {
  border-radius: 10px;  /* свойство для тех кто его поддерживает */
  -moz-border-radius: 10px;  /* для firefox */
  -webkit-border-radius: 10px;  /* для Safari и Chrome */
}

  • 0

#6 isvetlichniy

isvetlichniy
  • Пользователь
  • 619 сообщений
  • Репутация: 93

Отправлено 15 Октябрь 2013 - 16:13

1. Пропишите класс к блоку div и придайте стиль border-radius. это простой способ, но на сколько помню он работает не во всех браузерах.

не работает только в старых браузерах, а если конкретно - то читайте спецификацию
я рекомендую не заморачиваться на счет браузеров, так как 90% пользователей уже используют "нужные" браузеры. Статистика по браузерам
  • 1

#7 freezeranet

freezeranet
  • Пользователь
  • 12 сообщений
  • Репутация: 1

Отправлено 16 Октябрь 2013 - 16:06

А вообще, обновляйте браузеры :)
  • 1

#8 WhiteIce

WhiteIce
  • Пользователь
  • 30 сообщений
  • Репутация: 2

Отправлено 23 Октябрь 2013 - 00:17

Скругление уголков не работает в ие8 и ниже, если нет требований поддержки в этих браузеров (делаете сайт для себя) сейчас уже можно ими принебречь. Для старых браузеров других версий есть префиксы.
Еще можно пользоваться такой штукой ( последняя версия на скорости уже не сказывается).
  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85


Оформление форума – IPBSkins.ru