forum.okis.ru
http://forum.okis.ru/

Контур шапки - как сделать?
http://forum.okis.ru/viewtopic.php?f=10&t=3976
Страница 1 из 2

Автор:  Kiki Jozhkina [ 08 июн 2013, 06:21 ]
Заголовок сообщения:  Контур шапки - как сделать?

Никогда не делала контур шапки...
Впервые столкнулась...
Шапку я сделала сама из своих материалов...
Оказалось к ней нужен контур шапки с закруглёнными углами... Если я не скачивала предлагаемые в уроке ШАПКУ и прочие детали, а наполняла все объекты своим содержанием, то где мне сейчас раздобыть этот контур? Наверное, его можно создать в фотошопе самостоятельно и потом как-то вставить перед шапкой, прикрывая тем самым её прямые углы? И, наверное, середину нужно предусмотреть в прозрачном слое? - чтобы через этот слой просматривалась сама шапка?
Кто сам так проделывал нечто подобное - отзовитесь, пожалуйста, и подскажите порядок действий! Права ли я в своих догадках? Или нужно сделать как-то иначе?
http://kinder-child.okis.ru/stuffed_animals.html
(оффтоп: надеюсь я правильно установила ссылку на свой сайт - прошу мне об этом сообщить!)
На моём сайте можно видеть - какие прямые уголки у моей шапки на данный момент...

Автор:  Kiki Jozhkina [ 08 июн 2013, 08:49 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

Попробовала сделать рамочку - пока получилась вот такая- из листочков...
При этом внутренний край при создании пространства рамочки был у меня округлый - а внешний - всё равно - прямоугольный... и фон получился прозрачный... Первый блин... комом! Над этим ещё буду работать...

А вот вопрос остался такой: отдельно закачать контур шапки не получалось...
Пришлось в фотошопе - открыть свой баннер-шапку, потом сделать на новом слое контур шапки (рамку), и всё это сохранить в png и потом лишь установить на сайт... В итоге никакого прописывания КОНТУРА ШАПКИ в CSS делать не пришлось... Это какой-то иной способ, а не тот, который в уроке рекомендован...
Растолкуйте пожалуйста - на каком повороте я заблудилась!?!

Автор:  PhotoShopRND [ 08 июн 2013, 10:00 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

"Закруглялка" углов...

Автор:  Kiki Jozhkina [ 09 июн 2013, 08:34 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

Какая классная штуковина! Вы- настоящий друг!

Автор:  Kiki Jozhkina [ 09 июн 2013, 10:11 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

В уроке написано:
Вы копируете то,что написано в вашей админке...
Открыла код шапки сайта и вот что у меня там написано: ФРАГМЕНТ

div.art-header-jpeg {
background: url(http://kinder-child.okis.ru/img/kinder- ... nner05.jpg);
}
kinder-child.okis.ru/media="screen"
div.art-header-jpeg {
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 966px;
height: 300px;
background-image: url('images/header.jpg');
background-repeat: no-repeat;
background-position: center center;
}


Путь к файлу опознаю, название файла опознаю...

Остальное - не понятно!

Актуальный вопрос:

куда вставить мои 20* закругления углов?


-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;


Всю ли эту композицию необходимо вставить или только её часть?

Главное: куда вставить и как?

У меня нет файла shapka_kontur.png который рекомендуется использовать в уроке...

Друзья мои! помогите правильно записать эти закругления!

[img][url=http://my-files.ru/zr34.Skärmklipp.PNG][img]http://my-files.ru/Download/zr34/Skärmklipp.PNG[/img][/url][/img]

Оффтоп: пытаюсь вставить скриншот- надеюсь получится на сей раз...
Нет - с вложением не получается... И со ссылкой тоже!

Автор:  Kiki Jozhkina [ 09 июн 2013, 10:13 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

http://my-files.ru/zr34.Sk%c3%a4rmklipp.PNG

Это ссылка на мой скриншот про закругление углов!

Автор:  Kiki Jozhkina [ 09 июн 2013, 10:19 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

Вот что я написала в своей админке - где я допустила ошибку?

http://my-files.ru/4cop.Sk%c3%a4rmklipp.PNG

Автор:  Murmur [ 24 июл 2013, 01:02 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

Хотите, можете сбросить мне файл шапки и я закруглю верхние углы на 20px.
murmav@i.ua

Автор:  Murmur [ 24 июл 2013, 03:04 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

Вообще нужно убрать вот это:
-webkit-border-radius: 20px;
-moz-border-radius: 20px;

Автор:  Murmur [ 24 июл 2013, 03:21 ]
Заголовок сообщения:  Re: Контур шапки - как сделать?

div.art-header-jpeg {
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 960px;
height: 300px;
border-radius:20px 20px 0px 0px;
background-image: url(/img/kinder-child/banner05.jpg);
background-repeat: no-repeat;
background-position: center center;
}

Проверьте адрес к файлу с шапкой (/img/kinder-child/banner05.jpg)
(!) но его не нужно начинать с http://... Он же внутри сайта, в (img) если вы ничего не переименовали)))

Думаю получится)

Страница 1 из 2 Часовой пояс: UTC + 3 часа [ Летнее время ]
Powered by phpBB® Forum Software © phpBB Group
http://www.phpbb.com/