Jump to content
  • 0

Градиент на заднем плане


d.dee
 Share

Question

Привет! Подскажите плз как писать

Задача:

Сделать меню над гардиентом,

нижняя часть выделеного пункта должена быть "сглаженой"

лого должно быть все время над гардиентом

Пример:

http://i33.fastpic.ru/big/2013/0414/d5/a771f38a4cadd07b848b0c04f6ebd1d5.jpg

Исходник: http://jsfiddle.net/ddee/NggPS/

спасибо)

Link to comment
Share on other sites

0 answers to this question

Recommended Posts

There have been no answers to this question yet

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By Velidan
      Доброго дня уважаемые коллеги. Подскажите пожалуйста, можно ли сделать с помощью градиентов вот такой эффект тиснения?
      http://savepic.net/7196577.htm
       
       Обычный градиент я знаю как делать, использовать несколько градиентов также умею. Но здесь как-то оно на искоса идет у уголков, даже не знаю что делать. Вырезать картинку и так пихать также не очень хочется. 
       
      Буду благодарен за любую помощь.
    • By nastja198
      Здравствуйте всем.
      Помогите пожалуйста написать код на CSS используя линейный градиент.
      Мне нужно создать фон, вот именно такой... и никак не получается!

      _http://itmages.ru/image/view/1967829/1ef0223d

      или такой

      _http://itmages.ru/image/view/1967841/08d358e2

      Перепробывала и перемучалась уже до не возможности. Самое большее, (методом тыка), смогла написать лишь это...

      @charset "utf-8";
      /* CSS Document */


      body {    background-color: black;
          background-image: linear-gradient(45deg, #F3EBA0 27%, transparent 27%, transparent 73%, #F3EBA0 73%),
                               linear-gradient(45deg, #F3EBA0 27%, transparent 27%, transparent 73%, #F3EBA0 73%);
          background-size: 9px 9px;
          background-position: 0 0, 3px 3px;
           }


      Однако это не то что нужно, да и работает "трудно"... перед запуском страницы экран 2-3 сек горит чёрным цветом.
      (К тому же это и не тот рисунок, который хотела изначально. Хотя, если бы фон загружался бы без задержки, было бы не плохо, но не получается ускорить...)

      http://itmages.ru/image/view/1967846/2582e62e

      Не предлагайте замостить паттерном jpg и base64 ! Мне надо с градиентом разобраться!
      За ранее буду признательна за любую помощь!!!!!!!!!!!!!!!!

      (У Google спрашивала; В поиске на форуме тоже искала-смотрела -- не помогло. Буду признательна за комментарии к коду )

      Паттерн можно создать здесь...
      _http://generatepattern.com/

      ==================
      Хотелось бы написпть код используя repeating-linear-gradient, по логике должен вроде быть "repeating".
      Как пример:


      body {
      background: -moz-repeating-linear-gradient(0deg, transparent 0, transparent 5px,  rgba(0, 0, 0, .1) 5px, rgba(0, 0, 0, .1) 10px),
             -moz-repeating-linear-gradient(90deg, transparent 0, transparent 5px, rgba(0, 0, 0, .1) 5px, rgba(0, 0, 0, .1) 10px);
      }

      Спасибо!

      Не получается вставить картинку а без неё, что требуется не понять. Картинки загрузила и вставила ссылку но почему-то их нет.
       
    • By kupas
      Всем привет! дайте совет плз или ткните носом =) Получил на верстку фон шапки такого вида(клац), тоесть узор плавно переходящий в сплошной цвет. Ситуация совершенно не патовая, прост хочется использовать самый оптимальный вариант. Если б градиента не было то нуль проблем - вырезал бы повторяющийся фрагмент узора и зарепитил по обеим осям. Тут надо другой подход. У меня пока 2 варианта:
      1) вырезать часть фона от верхней точки(с узором) до момента где начинается цвет (вышло изображение(клац) 4х360 пикс величиной 2,49 КБ), далее зарепитить по иксу, а остальное залить цветом.
      2) вырезать фрагмент узора(клац) (4х4 пикс), залить им весь фон хедера. Потом в хвотошопе сделать фрагмент фона с вертикальным градиентом от прозрачного(сверху в низ) к цвету в который должен переходить фон хедера и наложить поверх фона с узором(зарепитить по иксу). PS: сорь за масло-маслянное, махните сто грамм для понимания)
       
      Мож есть еще какой вариант более оптимальный? К кроссбраузерности не привязываться. Или я заморачиваюсь? =)
       
       
    • By Shenia132
      Как сделать такой фон на всю ширину окна браузера и чтоб красиво смотрелось ?

    • By sitemaker999
      Здравствуйте! Делаю фотогалерею.

      В блоке мне надо чтобы в местах a и b блок угасал градиентом.
      (в блоке у меня картинки)
      (фон блока белый)
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy