Перейти к содержанию

Как сделать градиентную заливку главного верхнего меню?


Рекомендуемые сообщения

Очень нужно сделать градиентную заливку главного верхнего меню.

Где Форумы и строка поиска.

Примерно как на главном сайте IPB.

Ссылка на комментарий
Поделиться на другие сайты

Ну так сделайте, там же всё банально..

invi.thumb.jpg.e0369b5576b417a239e3093b4bdb0351.jpg

Ссылка на комментарий
Поделиться на другие сайты

Densv 

#ipsLayout_header nav {

    background: linear-gradient(0.90turn,rgb(0, 100, 255) 15%,#4a76a8 30%,rgba(134, 14, 255, 0.79) 75%) !important;
}
Спойлер

836129722_(25).thumb.png.81228093b03892ab2f1c85074976fbfb.png

 

Ссылка на комментарий
Поделиться на другие сайты

34 минуты назад, SlawkA сказал:

Densv 


#ipsLayout_header nav {

    background: linear-gradient(0.90turn,rgb(0, 100, 255) 15%,#4a76a8 30%,rgba(134, 14, 255, 0.79) 75%) !important;
}
  Показать контент

836129722_(25).thumb.png.81228093b03892ab2f1c85074976fbfb.png

 

Не подскажите, как на моем форуме сделать фон градиентом заливкой. 

Ссылка на комментарий
Поделиться на другие сайты

AnWey пример

background-image: repeating-radial-gradient(circle at 50% 15%, #4a4a4a91, #82828221 7px);
Спойлер

2021087892_(26).thumb.png.836ff2ad1e843a0eb0d68a1644ea93bd.png

 

Ссылка на комментарий
Поделиться на другие сайты

Правильно ? 

#ipsLayout_header nav {  
background-image: repeating-radial-gradient(circle at 50% 15%, #4a4a4a91, #82828221 7px);
}

Ссылка на комментарий
Поделиться на другие сайты

27 минут назад, AnWey сказал:

Правильно ? 

#ipsLayout_header nav {  
background-image: repeating-radial-gradient(circle at 50% 15%, #4a4a4a91, #82828221 7px);
}

вот

#ipsLayout_header header {
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15), 0px 1px 0px rgba(0, 0, 0, 0.1);
    background: linear-gradient(0.90turn,rgb(0, 100, 255) 15%,#4a76a8 30%,rgba(134, 14, 255, 0.79) 75%) !important;
}

 

Ссылка на комментарий
Поделиться на другие сайты

26 минут назад, andros0789 сказал:

вот


#ipsLayout_header header {
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.15), 0px 1px 0px rgba(0, 0, 0, 0.1);
    background: linear-gradient(0.90turn,rgb(0, 100, 255) 15%,#4a76a8 30%,rgba(134, 14, 255, 0.79) 75%) !important;
}

 

Поставил код, спасибо работает, но не там цвет меняет, он меняет цвет заголовка, я имел виду чтоб код менял цвет фона форума, как на ipbmafia.

Ссылка на комментарий
Поделиться на другие сайты

10 минут назад, AnWey сказал:

цвет фона форума, как на ipbmafia.

ну так выше я тебе скинул код. его надо в css загнать в body с подменой.

Ссылка на комментарий
Поделиться на другие сайты

12 минут назад, SlawkA сказал:

ну так выше я тебе скинул код. его надо в css загнать в body с подменой.

подскажите пожалуйста как писать коде 

#body nav {  
background-image: repeating-radial-gradient(circle at 50% 15%, #4a4a4a91, #82828221 7px);
} ???

Ссылка на комментарий
Поделиться на другие сайты

#body писать не надо, body не id, это тег, поэтому просто 

body nav {

}

Ссылка на комментарий
Поделиться на другие сайты

Может кто-нибудь помочь написать код для отображения цветов как в меню у главного сайта IPB.

За вознаграждение.

 

Безымянный.jpg

Безымянный2.jpg

Ссылка на комментарий
Поделиться на другие сайты

1 час назад, Desti сказал:

#body писать не надо, body не id, это тег, поэтому просто 

body nav {

}

Увы 

body nav {  
background-image: repeating-radial-gradient(circle at 50% 15%, #4a4a4a91, #82828221 7px);
} 

Не могу сохранить 

Ссылка на комментарий
Поделиться на другие сайты

Densv в хедере используют код css

.sMainHead {
    background-color: #294c7b;
    background: -webkit-gradient(linear, left top, right top, from(#294c7b), to(#0d5e71));
    background: linear-gradient(to right, #294c7b 0%, #0d5e71 100%);
    position: relative;
    z-index: 100;
}

в навбаре код и картинка

.sHero--standardNav {
    min-height: 50px;
    background: #3470aa;
        background-position-x: 0%;
        background-position-y: 0%;
        background-repeat: repeat;
        background-image: none;
        background-size: auto;
    background-image: url("//invisioncommunity.com/site_assets//images/head_background.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

я думаю можно самому это сделать за 5 минут.

я на работе. не смогу ковыряться. а так вроде все нашел по твоему запросу.

34434.png

AnWey ну вот за 1 минуту через Режим разработчика сделал.

похоже?

Спойлер

234550735_(27).thumb.png.c1b90473a115facb709bc59ce43cdd83.png

 

Ссылка на комментарий
Поделиться на другие сайты

SlawkA 

А код в globalTemplate менять нужно?

 

Ссылка на комментарий
Поделиться на другие сайты

10 часов назад, Densv сказал:

SlawkA 

А код в globalTemplate менять нужно?

 

нет не нужно. только в css

Ссылка на комментарий
Поделиться на другие сайты

SlawkA 

 

А где это можно в css найти?

 

Ссылка на комментарий
Поделиться на другие сайты

Densv  любой новый код со стилями вставляете в custom.css

Ссылка на комментарий
Поделиться на другие сайты

Что то я вписал

.sHero--standardNav {
    min-height: 50px;
    background: #3470aa;
        background-position-x: 0%;
        background-position-y: 0%;
        background-repeat: repeat;
        background-image: none;
        background-size: auto;
    background-image: url("//invisioncommunity.com/site_assets//images/head_background.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

 

в custom.css

 

но у меня ничего не происходит.

Ссылка на комментарий
Поделиться на другие сайты

/* Навбар */
#ipsLayout_header nav  {
    min-height: 50px;
    background: #3470aa;
        background-position-x: 0%;
        background-position-y: 0%;
        background-repeat: repeat;
        background-image: none;
        background-size: auto;
    background-image: url("//invisioncommunity.com/site_assets//images/head_background.jpg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Хедер */
header {
    background-color: #294c7b;
    background: -webkit-gradient(linear, left top, right top, from(#294c7b), to(#0d5e71));
    background: linear-gradient(to right, #294c7b 0%, #0d5e71 100%);
    position: relative;
}
Спойлер

1517186800_bandicam2020-11-1314-56-44-089.thumb.jpg.5e72b7e9628c8e13846c91df240bcdf0.jpg

 

Ссылка на комментарий
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

  • Последние посетители   0 пользователей онлайн

    • Ни одного зарегистрированного пользователя не просматривает данную страницу
×
×
  • Создать...