moneytown1
Участник
- Сообщения
- 14
- Реакции
- 0
- Сообщения
- 47
- Реакции
- 25
HTML:
<img class="rot" src="..."/>
CSS:
img.rot:hover {
animation: 1s linear 0s normal none infinite running rot;
-webkit-animation: 1s linear 0s normal none infinite running rot;
}
@keyframes rot {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@-webkit-keyframes rot {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
Последнее редактирование:
moneytown1
Участник
- Сообщения
- 14
- Реакции
- 0
А куда именно CSS код ставить? У меня стандарт фруктовой фермы в основе.CUTUZ написал(а):HTML:<img class="rot" src="..."/>
CSS:img.rot:hover { animation: 1s linear 0s normal none infinite running rot; -webkit-animation: 1s linear 0s normal none infinite running rot; } @keyframes rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @-webkit-keyframes rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
moneytown1
Участник
- Сообщения
- 14
- Реакции
- 0
И ещё вопрос, как сделать свечение вокруг блоков с текстом? Это типо рамка но не рамка, просто как будто неоновая обводка вокруг рамок с текстом. Буду очень признателен за помощь.CUTUZ написал(а):HTML:<img class="rot" src="..."/>
CSS:img.rot:hover { animation: 1s linear 0s normal none infinite running rot; -webkit-animation: 1s linear 0s normal none infinite running rot; } @keyframes rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @-webkit-keyframes rot { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
Вот пример рамки которая нужна, только просьба объяснить что и куда если не затруднит)
Вложения
-
1,1 MB Просмотры: 9
- Сообщения
- 47
- Реакции
- 25
box-shadow: 0 0 10px red;moneytown1 написал(а):И ещё вопрос, как сделать свечение вокруг блоков с текстом? Это типо рамка но не рамка, просто как будто неоновая обводка вокруг рамок с текстом. Буду очень признателен за помощь.
Вот пример рамки которая нужна, только просьба объяснить что и куда если не затруднит)
Впиши в стилях. Используем тень как свечение, заменив черный цвет на красный
0 - сдвиг по Х
0- сдвиг по Y
10px - размер свечения/тени
Red - цвет
- Сообщения
- 47
- Реакции
- 25
Впиши в текстовый документ, сохранив в формате name.css и в основном файле структуры страницы укажи путь к этому файлу <link type=“style” src=“name.css”> между <head>...</head>moneytown1 написал(а):А куда именно CSS код ставить? У меня стандарт фруктовой фермы в основе.
Если не ошибаюсь, должно получится.
- Сообщения
- 47
- Реакции
- 25
Или в самом коде, где прописана эта картинка вертящаяся, вставь этот css в теги <style>сюда</style>CUTUZ написал(а):Впиши в текстовый документ, сохранив в формате name.css и в основном файле структуры страницы укажи путь к этому файлу <link type=“style” src=“name.css”> между <head>...</head>
Если не ошибаюсь, должно получится.
moneytown1
Участник
- Сообщения
- 14
- Реакции
- 0
Ого, насколько подробно) этот ксс нужно вставить перед картинкой или перед какими строками? Или перед <div>? Или как?) Я просто не особо бум-бум по стилямCUTUZ написал(а):Или в самом коде, где прописана эта картинка вертящаяся, вставь этот css в теги <style>сюда</style>
- Сообщения
- 47
- Реакции
- 25
вставь после </head> нормально будет. А вообще по сути без разницы практически.moneytown1 написал(а):Ого, насколько подробно) этот ксс нужно вставить перед картинкой или перед какими строками? Или перед <div>? Или как?) Я просто не особо бум-бум по стилям
moneytown1
Участник
- Сообщения
- 14
- Реакции
- 0
И ещё вопрос, таким Макаром я смогу создавать в этом файле другие эффекты для других фото?CUTUZ написал(а):вставь после </head> нормально будет. А вообще по сути без разницы практически.
moneytown1
Участник
- Сообщения
- 14
- Реакции
- 0
Это нужно каждую рамку по классу искать в стилях? Папка main.cas? Я верно понимаю?CUTUZ написал(а):box-shadow: 0 0 10px red;
Впиши в стилях. Используем тень как свечение, заменив черный цвет на красный
0 - сдвиг по Х
0- сдвиг по Y
10px - размер свечения/тени
Red - цвет
И там можно будет эту строчку между любыми строками в столбце поставить? Неважно же куда я запихну главное чтоб в пределах строк определенного класса?
- Сообщения
- 47
- Реакции
- 25
Даmoneytown1 написал(а):И ещё вопрос, таким Макаром я смогу создавать в этом файле другие эффекты для других фото?
- Сообщения
- 47
- Реакции
- 25
Ничего не понял. Все блоки с class="" будут иметь один и тот же стиль, который мы прописали. в html коде рамку которую тебе нужно сделать светящейся возьми в блок с классом (например class="glow"), затем в тегах <style>...</style> пропиши название этого класса и какой стиль ему задать:moneytown1 написал(а):Это нужно каждую рамку по классу искать в стилях? Папка main.cas? Я верно понимаю?
И там можно будет эту строчку между любыми строками в столбце поставить? Неважно же куда я запихну главное чтоб в пределах строк определенного класса?
Код:
<style>
.glow{
box-shadow: 0px 0px 10px red;
}
</style>
2. Вариант: вписать в самом блоке его стиль:
Код:
<img src="название.png" style="box-shadow: 0px 0px 10px red;"/>