Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.52/25: Рейтинг темы: голосов - 25, средняя оценка - 4.52
0 / 0 / 0
Регистрация: 13.04.2017
Сообщений: 15

Увеличение текста Анимация

23.03.2019, 10:24. Показов 5129. Ответов 4

Студворк — интернет-сервис помощи студентам
помогите пожалуйста. дали задание, увеличить текст в размере от 10 до 100 анимацией
Вот программа. Прикрепил также файл style и библиотеку анимаций.
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<DOCTYPE html>
<html>
 
<head>
 
<meta charset="utf-8">
<link type="text/css" rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="animate.css">
<title>АНИМАЦИЯ В CSS.</title>
 
</head>
 
<body>
    <div class="container">
   <p>
   На всей планете хватит и тебе огня,<br>
Разлук и встреч, любви, страданий, чувства риска,<br>
Ты только не седлай не своего коня<br>
И счастья не бери, хотя оно и близко.<br>
 
1974, 2018<br></p>
    </div>
    
    <br><br>
 
</body>
 
</html>
Вложения
Тип файла: rar animate, style.rar (4.3 Кб, 2 просмотров)
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
23.03.2019, 10:24
Ответы с готовыми решениями:

Увеличение текста.
Здравствуйте, при увеличении/уменьшении масштаба страницы, текст на ней находящийся &quot;скачет&quot;. Особенно хорошо это видно по...

увеличение, изменение текста
Помогите плз сделать так, чтобы текст выделялся другим цветом при наводке мишки .dis_right_bg_main { min-width:0px; ...

Увеличение размер тени у текста (text-shadow)
Можно ли сделать так, чтоб размер тени от текста был больше, чем размер самого текста? Например, размер шрифта 100 пикселей, а тень должна...

4
 Аватар для Freeze_Breeze
278 / 272 / 106
Регистрация: 12.01.2016
Сообщений: 1,666
23.03.2019, 10:52
DmitrySky,
Цитата Сообщение от DmitrySky Посмотреть сообщение
увеличить текст в размере
Скажите тому кто это придумал, что таким извращением ни кто не занимается.
За анимацию увеличения отвечает свойство scale
CSS
1
2
3
.grow:hover {
    transform: scale(1.2);
}
Что то типо такого. При наведении будет что то увеличиваться.
0
0 / 0 / 0
Регистрация: 13.04.2017
Сообщений: 15
23.03.2019, 11:08  [ТС]
я попытался, не увеличивается.

Добавлено через 10 минут
Цитата Сообщение от Freeze_Breeze Посмотреть сообщение
DmitrySky,

Скажите тому кто это придумал, что таким извращением ни кто не занимается.
За анимацию увеличения отвечает свойство scale
CSS
1
2
3
.grow:hover {
    transform: scale(1.2);
}
Что то типо такого. При наведении будет что то увеличиваться.
И мне нужно что бы само увеличилось, а не при наведении
0
 Аватар для Freeze_Breeze
278 / 272 / 106
Регистрация: 12.01.2016
Сообщений: 1,666
23.03.2019, 12:18
DmitrySky, еще раз повторюсь, не занимайтесь извращением, того кто это задание придумал можете слать на все четыре стороны
HTML5
1
<h1>Hello world</h1>
CSS
1
2
3
4
5
6
7
h1 {
    font-size: 10px;
}
 
h1:hover {
    font-size: 100px;
}
0
204 / 67 / 41
Регистрация: 15.09.2018
Сообщений: 197
23.03.2019, 18:20
jsfiddle

HTML5
1
2
3
4
5
6
<div class="container">
<p class="text_animate">На всей планете хватит и тебе огня,</p>
<p class="text_animate">Разлук и встреч, любви, страданий, чувства риска,</p>
<p class="text_animate">Ты только не седлай не своего коня</p>
<p class="text_animate">И счастья не бери, хотя оно и близко.</p>
</div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
@import url('https://fonts.googleapis.com/css?family=Noto+Serif');
 
* {
  box-sizing: border-box;
}
 
 
/* 360-30-34 */
 
html{
  font-family: "Noto Serif", serif;
}
 
.container{
  margin-top: 30px;
  text-align: center;
  font-size: 12px;
}
  
 
p{
  line-height: 35px;
  margin: 0;
}
 
.text_animate:nth-child(1){
  animation: text_animate 12s forwards infinite 0s;
}
 
.text_animate:nth-child(2){
  animation: text_animate 12s forwards infinite 3s;
}
 
.text_animate:nth-child(3){
  animation: text_animate 12s forwards infinite 6s;
}
 
.text_animate:nth-child(4){
  animation: text_animate 12s forwards infinite 9s;
}
 
 
 
@keyframes text_animate {
  25% {
    font-size: 20px;
  }
  50%{
    font-size: 12px;
  }
  100% {
    font-size: 12px;
  }
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
23.03.2019, 18:20
Помогаю со студенческими работами здесь

Анимация текста - временное увеличение размера и смена цвета
Гуру помогите! Никогда с анимацией не работал. Есть десяток TextView на активити. При некоторых важных изменениях надо обратить на...

Увеличение текста в компоненте
как сделать, чтобы при нажатии на какую-то компоненту текст в RichEdit увеличивался. н-р, нажали и текст стал 14 размера, нажал и 16...

Увеличение/уменьшение размера текста
Здравствуйте, помогите пожалуйста! Такая задача: Сделать чтоб одна кнопка увеличивала размер (кегль) текста на 1 пункт, а другая уменьшала....

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

Увеличение текста при навидении в Label
Допустим стоял стандартный текст 14 когда авел на него вышкой он стал 18. Как это можно реализовать?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
Автозаполнение реквизита при выборе элемента справочника
Maks 27.03.2026
Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. При выборе "Спецтехники" (Тип Справочник. Спецтехника), заполняется. . .
Сумматор с применением элементов трёх состояний.
Hrethgir 26.03.2026
Тут. https:/ / fips. ru/ EGD/ ab3c85c8-836d-4866-871b-c2f0c5d77fbc Первый документ красиво выглядит, но без схемы. Это конечно не даёт никаких плюсов автору, но тем не менее. . . всё может быть. . .
Автозаполнение реквизитов при создании документа
Maks 26.03.2026
Программный код из решения ниже размещается в модуле объекта документа, в процедуре "ПриСозданииНаСервере". Алгоритм проверки заполнения реализован для исключения перезаписи значения реквизита,. . .
Команды формы и диалоговое окно
Maks 26.03.2026
1. Команда формы "ЗаполнитьЗапчасти". Программный код из решения ниже на примере нетипового документа "ЗаявкаНаРемонтСпецтехники" разработанного в конфигурации КА2. В качестве источника данных. . .
Кому нужен AOT?
DevAlt 26.03.2026
Решил сделать простой ланчер Написал заготовку: dotnet new console --aot -o UrlHandler var items = args. Split(":"); var tag = items; var id = items; var executable = args;. . .
Отправка уведомления на почту при изменении наименования справочника
Maks 24.03.2026
Программная отправка письма электронной почты на примере изменения наименования типового справочника "Склады" в конфигурации БП3. Перед реализацией необходимо выполнить настройку системной учетной. . .
модель ЗдравоСохранения 5. Меньше увольнений- больше дохода!
anaschu 24.03.2026
Теперь система здравосохранения уменьшает количество увольнений. 9TO2GP2bpX4 a42b81fb172ffc12ca589c7898261ccb/ https:/ / rutube. ru/ video/ a42b81fb172ffc12ca589c7898261ccb/ Слева синяя линия -. . .
Midnight Chicago Blues
kumehtar 24.03.2026
Такой Midnight Chicago Blues, знаешь?. . Когда вечерние улицы становятся ночными, а ты не можешь уснуть. Ты идёшь в любимый старый бар, и бармен наливает тебе виски. Ты смотришь на пролетающие. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru