Есть готовый код, но как мне соединить CSS и JavaScript в HTML?

Question

VitalyDmi @VitalyDmi

Есть готовый код, но как мне соединить CSS и JavaScript в HTML?

Здравствуйте, я не могу соединить все в одно, мне нужен только HTML. Помогите это сделать, пожалуйста, кто знает =)
Вот код: https://codepen.io/dev_loop/pen/oVaRwX

Вопрос задан более трёх лет назад
230 просмотров

3 комментария

Подписаться 1 Простой 3 комментария

Борис Свиридов @thunder_thurth

dlod.ru/podklyuchit-js-ili-css-k-html
https://puzzleweb.ru/javascript/1_whereto.php
Читаем

Написано более трёх лет назад

LS Timer @light___soul

<link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet"><script src="https://cdn.jsdelivr.net/npm/baffle@0.3.6/dist/baffle.min.js"></script>
<div class="container">
  <div class="data">
    Come On!
  </div>
  <div class="quote">
    Let's learn to code
  </div>
</div>

<style>
  body{
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: #0F2027;

}
.container{
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.data{
  text-align: center;
  
  color: #fff;
  font-family: poppins;
  font-size: 2em;
  letter-spacing: 12px;
  font-weight: 600;
/*   position: absolute; */
/*   top: 50%; */
/*   left: 50%; */
/*   transform: translate(-50%, -50%); */
}
.quote{
  text-align: center;
  color: #fff;
  font-family: ubuntu, poppins;
  font-size: em;
  letter-spacing: 12px;
  font-weight: 600;
/*   position: fixed; */
/*   top: 50%; */
/*   left: 50%; */
/*   transform: translate(-50%, -50%); */
}
</style>
<script>
  const text = baffle('.data');
text.set({
  characters : 'zpxzVpasdfh86136░█▒ ░░░█▓ >░░ ▓/▒█▓ █ █>█▒sayg▒ ░░░█▓ >yf',
  speed: 150
});
text.start();
text.reveal(70000);

const text1 = baffle('.quote');
text1.set({
  characters : 'qwertyuiopasdfgh8613611888',
  speed: 140
});
text1.start();
text1.reveal(5500);
</script>

Написано более трёх лет назад

VitalyDmi @VitalyDmi Автор вопроса

LS Timer, Спасибо!

Написано более трёх лет назад

Решения вопроса 1

Комментировать

Пригласить эксперта

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

CSS

Простой
Как сделать чтобы не выделялся текст в инпуте?
- 1 подписчик
- 20 часов назад
- 97 просмотров
1

ответ
CSS

Простой
Как сделать бесконечно бегущую строку логотипов, но чтобы они двигались волной?
- 6 подписчиков
- 23 часа назад
- 848 просмотров
0

ответов
JavaScript

Простой
Как найти и сгруппировать элементы с одинаковым классом?
- 1 подписчик
- вчера
- 69 просмотров
1

ответ
JavaScript

+2 ещё

Средний
Как скроллить определенный блок Div?
- 1 подписчик
- вчера
- 122 просмотра
0

ответов
JavaScript

+1 ещё

Простой
Как написать текст на окружности и посчитать точки?
- 1 подписчик
- вчера
- 90 просмотров
0

ответов
JavaScript

Средний
Как остановить весь скрипт js при выполнении условия tampermonkey?
- 1 подписчик
- вчера
- 81 просмотр
2

ответа
JavaScript

Средний
.stopPropagation() на самом деле не останавливает распространение события?
- 1 подписчик
- 26 дек.
- 115 просмотров
1

ответ
JavaScript

Простой
Нужно ли проверять импорт модуля js на повторную загрузку?
- 1 подписчик
- 26 дек.
- 56 просмотров
1

ответ
HTML

+1 ещё

Простой
Как сделать одинаковую высоту у карточек?
- 1 подписчик
- 26 дек.
- 117 просмотров
1

ответ
HTML

+1 ещё

Простой
Как внизу блока сделать маску волной и поместить туда изображение?
- 2 подписчика
- 26 дек.
- 164 просмотра
2

ответа
Показать ещё Загружается…

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

Fullstack-разработчик PHP/JavaScript

LegalIndonesia

от 3 000 до 3 000 $

Бэкэнд-разработчик JavaScript

Wanted. • Москва

от 250 000 до 400 000 ₽

Закончить разработку мобильного приложения FLUTTER

28 дек. 2024, в 11:51

40000 руб./за проект

Доработать backend для платформы Full-time, Mid+/Senior

28 дек. 2024, в 10:57

1500 руб./в час

Настройка AFFiNE на сервере с помощью удаленной консультации

28 дек. 2024, в 10:52

1000 руб./за проект

dlod.ru/podklyuchit-js-ili-css-k-html
https://puzzleweb.ru/javascript/1_whereto.php
Читаем
<link href="https://fonts.googleapis.com/css?family=Poppins" rel="stylesheet"><script src="https://cdn.jsdelivr.net/npm/baffle@0.3.6/dist/baffle.min.js"></script> <div class="container"> <div class="data"> Come On! </div> <div class="quote"> Let's learn to code </div> </div> <style> body{ margin: 0; padding: 0; width: 100%; height: 100%; background: #0F2027; } .container{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .data{ text-align: center; color: #fff; font-family: poppins; font-size: 2em; letter-spacing: 12px; font-weight: 600; /* position: absolute; */ /* top: 50%; */ /* left: 50%; */ /* transform: translate(-50%, -50%); */ } .quote{ text-align: center; color: #fff; font-family: ubuntu, poppins; font-size: em; letter-spacing: 12px; font-weight: 600; /* position: fixed; */ /* top: 50%; */ /* left: 50%; */ /* transform: translate(-50%, -50%); */ } </style> <script> const text = baffle('.data'); text.set({ characters : 'zpxzVpasdfh86136░█▒ ░░░█▓ >░░ ▓/▒█▓ █ █>█▒sayg▒ ░░░█▓ >yf', speed: 150 }); text.start(); text.reveal(70000); const text1 = baffle('.quote'); text1.set({ characters : 'qwertyuiopasdfgh8613611888', speed: 140 }); text1.start(); text1.reveal(5500); </script>

Answer 1 · 2019-03-31 10:33:02

Содержимое CSS кладешь в имяфайла.css
Содержимое JS кладешь в имяфайла.js
В HTML коде:

<head>
....
<link rel="stylesheet" href="имяфайла.css">
</head>
<body>
.....
<script src="имяфайла.js"></script>
</body>

Есть готовый код, но как мне соединить CSS и JavaScript в HTML?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт