Скругленные углы блоков в Css

ВЫЕЗД ИЗ УКРАИНЫ • ОФОРМЛЕНИЕ ДОКУМЕНТОВ • БРОНИРОВАНИЕ • ПОМОЩЬ С ТЦК

УСТРАНЕНИЕ КОНКУРЕНТОВ. БЛОКИРОВКА ДОМЕНОВ, БЛОКИРОВКА ИНСТАГРАМ/ТЕЛЕГРАМ И ДРУГОЕ. ПРОВЕРЕННЫЙ СЕЛЛЕР.

НОВЫЕ ТОРГОВАЯ НОВОСТИ ЧАТ

Скрыть

		ANTICHAT > ПРОГРАММИРОВАНИЕ > PHP
Скругленные углы блоков в Css

Страница 1 из 2

Опции темы

Поиск в этой теме

Опции просмотра

Скругленные углы блоков в Css

28.02.2008, 23:45

~~smOleg~~

Banned

Регистрация: 30.11.2007

Сообщений: 114

С нами: 9708371

Репутация: 54

Скругленные углы блоков в Css

Нашел скриптик на ЖС но он очень шото. Он скругляет добавляя в конец и вначало блока несколько блоков в 1пх.. иллюзия скругления.

Не подходит восновном т.к. эти добавочние блоки становатся сразу сначала и вконец контента внутри блока. Ну задал height и границы блока стают нужной высоты а скругления бегают за текстом.
(канеш можна внутр. отступами както но нада шоб контент менялся а скругления на месте были..)

А картинки не хочу использовать (это мое тестовое задание на работу хочу покруче

)

Вобщем подскажите решение, если оно есть канеш %)

Чтоб на бекграунд както кинуть динамически созданный прямоугольний со скругленными углами со сторонами как ширина и высота блока %)

Вобщем кто с этим имеет дело поделитесь може у вас есть нестандартный способ

Ох уж эта мода на висту

У меня вот например оформление все квадратное и меня устраивает

. И нах им эти кругляки и градиенты.

Кстати може можна градиент сделать не картинкой?

𝕏 Twitter Reddit Telegram Копировать ссылку

Последний раз редактировалось smOleg; 29.02.2008 в 00:08..

29.02.2008, 00:07

scrat

Постоянный

Регистрация: 08.04.2007

Сообщений: 853

С нами: 10048706

Репутация: 1540

Вот к примеру метод.Я так понимаю твой js-скрипт реализует именно его.Насколько мне известно можно только с помощью CSS/изображений

29.02.2008, 00:12

~~smOleg~~

Banned

Регистрация: 30.11.2007

Сообщений: 114

С нами: 9708371

Репутация: 54

Да. Тоже самое. Только я нашел чел на англиском писал. И главно все пишут от первого имени будто это их идея

29.02.2008, 00:37

astrologer

Постоянный

Регистрация: 30.08.2007

Сообщений: 773

С нами: 9840758

Репутация: 808

Цитата:

это мое тестовое задание на работу хочу покруче

мда...
Всё очень просто.
Без графики совсем обойтись не удастся, если нужен кроссбраузерный вариант.

С помощью JS можно сгенерировать векторную графику SVG. В данном случае понадобится один-единственный кружок, ненужные части которого обрезаются CSS-свойством "clip".

т.к. формат SVG - суть простая разметка, проблем с этим возникнуть не должно.
За исключением IE, который вместо SVG поддерживает VML. Остаётся только написать на JS код абстракции над SVG и VML и тебя возьмут на работу.

29.02.2008, 03:26

Midas

Участник форума

Регистрация: 17.01.2008

Сообщений: 284

С нами: 9639135

Репутация: 117

Цитата:

Границы в CSS3
6 октября, 2007

Стандарт CSS3 на сегодняшний день ещё находится в разработке. Но уже можно поэкспериментировать с некоторыми новыми возможностями. Одной из таких возможностей является поддержка закруглённых углов границ.

Вообще-то, эту возможность нужно было ввести несколько лет назад. На сегодняшний день создание блока со скруглёнными границами требует использования рисунков, что усложняет разметку и увеличивает объем страницы. Но, как говориться лучше поздно, чем никогда.

Для создания границы используется свойство border-radius, которое задаёт радиус закругления углов. Например, border-radius: 5px.
Кроме того, предусмотрены свойства, позволяющие закруглить любой из углов блока отдельно. Например, для верхнего правого угла используется свойство border-top-right-radius. Если для этого свойства будут заданы два числа, то граница будет эллиптической.
Подробнее почитать о закруглённых границах (и не только о них) можно на официальном сайте.

Также советую посмотреть примеры на css3.info .

К сожалению, пока все эти возможности работают далеко не во всех браузерах. Если говорить конкретнее, то нужен или Firefox или Safari 3. Пользователям IE, скорее всего, придётся ждать новую версию браузера (хорошо если одну ).
Так что, широкое использование этих технологий мы увидим ещё не скоро. Но, все таки приятно, что CSS развивается, а разработчики стандарта учитывают тенденции в современном web дизайне (хоть и с опозданием).

P.S. Люди, пользуйтесь нормальными браузерами

http://www.simplecoding.org/granicy-v-css3.html

29.02.2008, 08:13

Дикс

Познавший АНТИЧАТ

Регистрация: 16.04.2006

Сообщений: 1,488

С нами: 10562786

Репутация: 537

Цитата:

Для создания границы используется свойство border-radius, которое задаёт радиус закругления углов. Например, border-radius: 5px.
...
Если говорить конкретнее, то нужен или Firefox или Safari 3.

чет пи*дёж и провокация. ниче ff не скругляет, только что проверил.