Чтобы знать о человеке многое, достаточно владеть немногим...

Закругленные края при помощи div’ов

Создано: Январь 6th, 2011 | Автор: | Рубрика: php | Теги: div, php, скрипт | 7 комментариев»

Сейчас я Вам расскажу как закруглить края при помощи дивов! Конечно, Вы не один раз уже слышали как это делается, однако, относясь к категории ленивых людей, я решился на написание функции которая выводила бы окошко необходимого размера, цвета и с закругленными краями. В результате было потрачено целых 2 дня на борьбу с математикой! Я пытался вывести формулу по которой бы все высчитывалось и правильно выводилось на экран. Науку мне победить не удалось, видимо не зря в аттестате стоит тройка! Но, с заданием я справился: углы скругляются, а фон меняется. Возможности скрипта:

  • выбор варианта угла (закругленный, скошенный, обычный — прямоугольный);
  • радиус скошенных углов возможен до 50 пикселей, закругленных — до 15;
  • изменение цвета фона;
  • изменение цвета текста;
  • задание ширины блока в пикселях, либо автоматически до ближайшей «стены»;
  • выравнивание текста внутри блока.

Вижу, не впечатлил, зато теперь можно парой строк вывести окошко с закругленными краями! Достигается все это очень просто, настолько просто, что Вы с легкостью сможете разобраться в моем не ровно написанном скрипте!

windows.php

Рассказать друзьям:
  • Добавить ВКонтакте заметку об этой странице
  • Мой Мир
  • Facebook
  • Twitter
  • MySpace
  • Одноклассники
Просмотров: 5 051

7 комментариев к “Закругленные края при помощи div’ов”

  1. 1  сказал в 21:37. Январь 18th, 2011:

    обидно, что ссылки с примерами ведут на локальный адрес :(

  2. 2 unknow сказал в 21:55. Январь 18th, 2011:

    Не понял, какие ссылки?

  3. 3 unknow сказал в 10:57. Январь 19th, 2011:

    Ссылки поправил!

  4. 4  сказал в 13:46. Апрель 18th, 2011:

    Буду знать.Спасибо автору.

  5. 5  сказал в 21:14. Август 1st, 2011:

    Спасибо, пригодилось! )

  6. 6 unknow сказал в 20:50. Август 6th, 2011:

    Да пожалуйста) Хотя, честно, не понимаю как это сейчас может пригодиться, все браузеры посл. версий уже поддерживают закругление краев. Вот css:
    .radius15 {border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;}

  7. 7  сказал в 10:28. Сентябрь 7th, 2012:

    Да, вот этот код: .radius15 {border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;} работает уже и в IE9. Не говоря уже про Оперу, Firefox, Хром.

Оставить ответ