X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

Открыть тему
Тема закрыта
> Вырезать круглую часть из блока
wadya87
wadya87
Topic Starter сообщение 11.10.2012, 18:41; Ответить: wadya87
Сообщение #1


Частый гость
**

Группа: User
Сообщений: 59
Регистрация: 6.12.2011
Поблагодарили: 10 раз
Репутация:   2  


Подскажите, это реально, пусть и не кроссбраузерно?

Я частично решил эту проблему, но только если фон не картинка. Т.е надо залить внешний фон и фон круга.

Задача в том, чтобы:
-никаких картинок, только css
-граница (красная) была полупрозрачной, (использовал border:5px solid rgba(169, 62, 37, 0.5); )
-фон внутри блока градиент (с помощью сайта, первый попавшийся через поиск)
-резиновый в ширину/длину (через min-width, min-height)
-круг фиксированный (блок с border-radius = width = height)

http://freecodes.ru/block.html
Вот как вышло для однообразного фона (в фаербаге можно цвета менять, текста добавить, чтоб убедиться в прозрачности и резинке).

Может в css3 есть какой-то вариант? Или вобще идеи? Помогите пожалуйста.

Сообщение отредактировал wadya87 - 11.10.2012, 18:41


--------------------
Верстаю html, делаю калькуляторы (js, php)
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Anatoly_ua
Anatoly_ua
сообщение 12.10.2012, 0:19; Ответить: Anatoly_ua
Сообщение #2


Новичок
*

Группа: Viewer
Сообщений: 7
Регистрация: 17.12.2007
Поблагодарили: 2 раза
Репутация:   0  


(wadya87 @ 11.10.2012, 17:41) *
Может в css3 есть какой-то вариант? Или вобще идеи? Помогите пожалуйста.

Тут вот нарыл вариант с "инверсными" скруглениями:
http://jonmifsud.com/blog/inverse-border-radius-in-css/
Я бы попробовал верхнюю часть прямоугольника (ту, которая с вырезом) сделать составной, из двух половинок (т.е. всего 3 основных блока). Мне кажется, должно получиться.
---------\      /---------
|    1     \__/       2   |
|           |             |
-------------------------
|                        |
|             3          |
|                        |
|                        |
-------------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыadmitad.com | партнерская сеть - часть 2
Официальный топик партнерской сети admitad.com
87 Antony_ADmitAD 28140 8.11.2017, 17:28
автор: admitad_official
Открытая тема (нет новых ответов) Програмная часть сайта
0 wmmarket 632 20.10.2016, 0:35
автор: wmmarket
Открытая тема (нет новых ответов) Подскажите партнерку - есть часть URL'a
1 MXMX 873 23.6.2016, 10:47
автор: psk89
Открытая тема (нет новых ответов) > Нужен рерайт по игре S.T.A.L.K.E.R (Часть #2)
4 OldSpice 905 3.12.2015, 16:42
автор: e16r
Открытая тема (нет новых ответов) Курс по программированию для SEO(часть 4)
Научись создавать доргены/постеры/комментаторы/парсеры и т.п.
27 ParavoZ 5199 11.11.2014, 2:37
автор: ParavoZ


 



RSS Текстовая версия Сейчас: 18.12.2017, 7:44
Дизайн