Форум АНТИЧАТ

Форум АНТИЧАТ (https://forum.antichat.xyz/index.php)
-   PHP, PERL, MySQL, JavaScript (https://forum.antichat.xyz/forumdisplay.php?f=37)
-   -   Скругленные углы блоков в Css (https://forum.antichat.xyz/showthread.php?t=63030)

smOleg 28.02.2008 23:45

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

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

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

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

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

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

Ох уж эта мода на висту :rolleyes: У меня вот например оформление все квадратное и меня устраивает :D . И нах им эти кругляки и градиенты.

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

scrat 29.02.2008 00:07

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

smOleg 29.02.2008 00:12

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

astrologer 29.02.2008 00:37

Цитата:

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

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

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

Midas 29.02.2008 03:26

Цитата:

Границы в 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

Цитата:

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

etc 29.02.2008 09:54

Украдите CSS из phpBB3 :) Я лично их кссами пользуюсь

astrologer 29.02.2008 16:37

Цитата:

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

-moz-border-radius
-khtml-border-radius ;)
Цитата:

Сообщение от etc
Украдите CSS из phpBB3 Я лично их кссами пользуюсь

Нехорошо

scrat 29.02.2008 17:33

Цитата:

Сообщение от astrologer
Нехорошо

Вообщето открытость исходников это подрузумевает.Просто нужно указать от куда ты это взял.

DIAgen 29.02.2008 17:50

Читать тута
http://habrahabr.ru/blog/webdev/36812.html


Время: 14:33