HTML, CSS

Форум программистов и сисадминов Киберфорум

Войти

Регистрация
Восстановить пароль

Другие темы раздела
HTML, CSS Сделать тень под блоком https://www.cyberforum.ru/ html/ thread2402325.html Необходимо сделать полукруглую тень под блоком, с учетом блок будет растягиваться на всю ширину страницы, то есть будет адаптивным.	Некорректно отображается фон HTML, CSS некорректно отображается фон при увеличении масштаба сайта он исчезает из правой части
HTML, CSS Картинка не двигается влево https://www.cyberforum.ru/ html/ thread2402233.html Помогите, пожалуйста разобраться, не пониманию, почему первая картинка не двигается влево. HTML: <div id="cats"> <a href="https://petstory.ru/knowledge/cats/cat-breeds/donskoy-cat/" alt target="_blank" ><img src="http://murkote.com/wp-content/uploads/2015/06/sphynx_white_kitty.jpg.pagespeed.ce.vV2pqU2wVY.jpg" height="200" border="2" ></a> CSS: #cats a img{ ...	HTML, CSS Блоки Помогите кому не лень накидать код по этим блокам https://www.cyberforum.ru/ html/ thread2402210.html
HTML, CSS Как правильно сделать svg иконки? Подскажите как правильно работать с SVG, не получается разместить по центу svg иконку. <footer> <div class="column1 inline"> <div class="socialWrapper"> <div class="social"> <svg style="fill:white; " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264 512"><path d="M76.7 512V283H0v-91h76.7v-71.7C76.7 42.4 124.3 0 193.8 0c33.3 0 61.9 2.5 70.2...	HTML, CSS CSS, ссылки https://www.cyberforum.ru/ html/ thread2401941.html Не работают стили для ссылок. При наведению на ссылку должен меняться цвет ссылки. https://drive.google.com/file/d/1Ageb4-dnDuuHHabxLvk4eVuajKZIENEG/view?usp=sharing - ссылка на файл который не работает GoogleДиск.
HTML, CSS Цветовой фон сайта Как сделать чтобы в самом начале сайта фон должен быть чёрным (наложил background-image в css, в итоге получились белые рамки, как убрать?), в середине белым, в конце серым? https://www.cyberforum.ru/ html/ thread2401930.html	HTML, CSS Не могу подключить плагин fullpage Не могу понять. Вроде всё подключил, вроде всё стилизовал, вроде всё разметил, но не работает! Что не так? Как исправить? <!DOCTYPE html> <html> <head> <link href="Title_css.css" rel="stylesheet"> <link rel="stylesheet" href="fullpage.css" type="text/css"> <script language="JavaScript" type="text/javascript" src="fullpage.js"></script> <script...
HTML, CSS Скорость загрузки слайдеров https://www.cyberforum.ru/ html/ thread2401819.html Всем привет. На сколько понимаю - слайдер на отдельной странице - это одна картинка с большим разрешением в фокусе + такие же картинки вне фокуса. Если таких картинок 40шт, то загрузка будет тупить. Для этого слайдер делят на отдельные страницы по 5-10 картинок, т.е. нужно сделать несколько слайдеров (html). Если делать один слайдер (html) с подгрузкой контента (каждые 5 картинок или по...	HTML, CSS CSS https://www.cyberforum.ru/ html/ thread2401781.html .button:hover { transition: 0.5s; border-radius: 3px; color:#000 !important; background: #fff; } Есть такой код, но тогда, когда убираешь мышь, то все происходит не плавно. Можно ли как-то сделать чтобы анимация происходила плавно в обратном направлении?
Создание сайта HTML, CSS Здравствуйте. Хочу создать такой сайт. ( https://yadi.sk/i/_8oqiIBUtNUKDg ) Вопросы: Как сделать выплывающее меню на опр. моменте? (Пользователь должен пролистнуть до опр. момента и меню высветится.) Кнопки: Главная (надо чтобы при нажатии на нёё страница пролистнулась в самый вверх, как реализовать?) Магазин (Переадресация на другую страницу, знаю как сделать) О...	HTML, CSS Сделать непрозрачными э-нты Здравствуйте! Я не силён в Web-разработке т.к. вижу себя в другом направлении. Но учёба заставляет работать и в этом русле тоже. Помогите, пожалуйста, сделать block2 и block3 непрозрачными(см. на рис.). +я немного не понимаю откуда вот-такие недограницы появляются когда я нажимаю на место соприкосновения двух блоков или выделяю текст или э-нт: Вот код: <!DOCTYPE html> <html> <head> https://www.cyberforum.ru/ html/ thread2401770.html

Gvizl

8 / 8 / 2

Регистрация: 31.01.2014

Сообщений: 464

11.02.2019, 23:27 [ТС]

Как сделать кривую форму с градиентом и анимацией смены формы? - HTML, CSS - Ответ 13317492

11.02.2019, 23:27. Показов 1462. Ответов 2

Метки (Все метки)

Ответ

Попробовал такой вариант - работает, но цвет меняется не плавно и после анимации форма резко возвращается к первоначальной.

CSS

  .mod { 
      clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);
      background: linear-gradient(to top, #fefcea, #f1da36);
      display: inline-block;
      width: 250px;
      height: 250px;
      
   }
   
   .mod:hover {
        animation: polygons 4s alternate;
   }
   
   @keyframes polygons {
      100% {
        clip-path: polygon(20% 0%, 100% 38%, 70% 90%, 0% 100%);
                 background: linear-gradient(to top, red, blue);
      }
    }

Добавлено через 2 часа 31 минуту

Сделал
Готовое решение
https://codepen.io/kirill-golybev/pen/LqmQoy

Сам полигон собирал тут
http://www.cssplant.com/clip-path-generator

Вернуться к обсуждению:
Как сделать кривую форму с градиентом и анимацией смены формы? HTML, CSS

Programming

Эксперт

94731 / 64177 / 26122

Регистрация: 12.04.2006

Сообщений: 116,782

11.02.2019, 23:27

Готовые ответы и решения:

Как развернуть форму с анимацией?
Не получается развернуть форму с использованием анимации. Вот класс: public class WinAPI { ...

Как сделать гиперссылку с формы на форму
как сделать гиперссылку с формы на форму?

Как FillPath сделать градиентом?
Необходимо в graphics.FillPath сделать градиент одного цвета. Т.е возьмём например прямоугольник и...

Как сделать переход с формы на другую форму?
Вот у меня два перехода на разные формы, и я вообще не могу понять в чем причина. MyForm не видит...

	11.02.2019, 23:27

IT_Exp

Эксперт

87844 / 49110 / 22898

Регистрация: 17.06.2006

Сообщений: 92,604

11.02.2019, 23:27

Помогаю со студенческими работами здесь

Как сделать форму владельцем другой формы
Сабж, как это сделать?

как сделать выделение в Listbox градиентом
пытаюсь сделать так TCanvas *pCanvas = ((TListBox *)Control)->Canvas; if(...

Как сделать полосатый фон с градиентом?
Нужно сделать полосатый фон с градиентом http://************/MXXQ. Вопрос: 1) Как это можно сделать...

Создать графический объект с анимацией и возможностью смены цвета
ребят, помогите плиз... можна обект придумать свой нужно содать любой графический...

Наверх