Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.54/13: Рейтинг темы: голосов - 13, средняя оценка - 4.54
7 / 8 / 3
Регистрация: 02.04.2018
Сообщений: 531

HTML pug можно ли переделать в HTML?

14.07.2018, 23:10. Показов 2608. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Нашёл красивую стилезацию чекбоксов. https://codepen.io/stefancenusa/pen/rVwEBB

но там написано на HTML pug, я так понял это смесь HTML и JS

HTML5
1
2
3
4
5
6
7
8
9
10
input(type="checkbox" id="c1")
label(for="c1").dgr.ripple-effect
input(type="checkbox" id="c2")
label(for="c2").dgr-wrg.ripple-effect
input(type="checkbox" id="c3")
label(for="c3").wrg.ripple-effect
input(type="checkbox" id="c4")
label(for="c4").wrg-ok.ripple-effect
input(type="checkbox" id="c5")
label(for="c5").ok.ripple-effect
и если input понятное дело

HTML5
1
<input type="checkbox" id="c1">
то как переделать тег label?
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
14.07.2018, 23:10
Ответы с готовыми решениями:

Html и css. Можно ли подогнать картинку в html под рамку
Добрый день. У меня такой вопрос. Создал рамку в фотошопе. Можно ли подогнать картинку в html под эту рамку, чтобы картинка не выезжала за...

переделать HTML код страницы
Создаю сайт не по шаблону и не втыкаю HTML систему.. Есть HTML код примерной страницы сайта, но нужно заменить в нем пару десятков...

Как переделать HTML книгу?
Здравствуйте! Помогите пожалуйста,как переделать старую электронную книгу на HTML в простую какую нибудь программу или исполняемый exe...

4
Эксперт JSЭксперт HTML/CSS
 Аватар для mrtoxas
3827 / 2677 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
14.07.2018, 23:39
Лучший ответ Сообщение было отмечено SergeyKagen как решение

Решение

В песочнице нажимаете на стрелку и выбираете "View Compiled HTML"

HTML5
1
2
<input type="checkbox" id="c1"/>
<label class="dgr ripple-effect" for="c1"></label>
0
 Аватар для Freeze_Breeze
278 / 272 / 106
Регистрация: 12.01.2016
Сообщений: 1,666
14.07.2018, 23:41
SergeyKagen, Pug это препроцессор для HTML, так же как SASS/LESS для CSS. А Вам не интересно было что это за стрелочки такие и зачем они нужны?
Миниатюры
HTML pug можно ли переделать в HTML?  
0
 Аватар для Omion
190 / 55 / 12
Регистрация: 19.05.2015
Сообщений: 352
17.07.2018, 17:04
вот так
Миниатюры
HTML pug можно ли переделать в HTML?  
0
26 / 36 / 15
Регистрация: 15.01.2017
Сообщений: 311
17.07.2018, 18:15
HTML5
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
<!DOCTYPE html>
<html lang="en" >
 
<head>
  <meta charset="UTF-8">
  <title>Material design circle buttons</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">
 
  
</head>
 
<body>
 
  
<input type="checkbox" id="c1"/>
<label class="dgr ripple-effect" for="c1"></label>
<input type="checkbox" id="c2"/>
<label class="dgr-wrg ripple-effect" for="c2"></label>
<input type="checkbox" id="c3"/>
<label class="wrg ripple-effect" for="c3"></label>
<input type="checkbox" id="c4"/>
<label class="wrg-ok ripple-effect" for="c4"></label>
<input type="checkbox" id="c5"/>
<label class="ok ripple-effect" for="c5"></label>
  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
 
  
 
    <script  src="js/index.js"></script>
 
 
 
 
</body>
 
</html>
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
17.07.2018, 18:15
Помогаю со студенческими работами здесь

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

Открытие блока в index.html из другого .html файла
Каким образом я могу открыть одну структуру кода html файла, в другом? Есть два файла index.html и index2.html. Мне нужна ссылка из...

как ??? В файле 1.html создать ссылку на документ 3.html. Данная ссылка должна отображаться во втором фрейме.
код с фреймами: &lt;html&gt; &lt;head&gt; &lt;/head&gt; &lt;frameset rows=&quot;30%,*&quot;&gt; &lt;frameset cols=&quot;50%,*&quot;&gt; &lt;frame name=&quot;Dwa&quot; src=&quot;2.html&quot;...

Как привязать стили 1.html к 1.html#img1?
как привязать стили 1.html к 1.html#img1 Почему то часть CSS на якорной странице не работает. Можно ли как то привязать - продублировать...

Импорт HTML файла в HTML код
Подскажите пожалуйста, какой командой импортируется HTML файл в основной HTML код? Грубо говоря, нужно на всех страницах сделать кнопки...


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

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
Символьное дифференцирование
igorrr37 13.02.2026
/ * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru