Веб-страница
24.5K subscribers
1.68K photos
522 videos
1 file
3.87K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
Скрытые возможности элемента input

Элемент input в HTML самый интересный.

Большинство его собратьев вне зависимости от своих атрибутов ведут себя одинаково. При этом атрибут type элемента input может принимать 22 разных значения, которые не только меняют его поведение, но и влияют на внешний вид.

Элемент input отвечает за всё, начиная с текстового ввода и чекбоксов, заканчивая переключателями и кнопкой для сброса всех полей в форме.

В этой статье описали не только различные типы input, но и сопутствующие атрибуты, о которых вы могли не знать, и которые делают этот элемент более удобным и применимым в различных ситуациях: https://habr.com/ru/companies/ruvds/articles/785690/

#html #лучшиепрактики
👍16🔥2
​​​Создаём калькулятор на чистом HTML и CSS

В статье подробно описывается процесс создания калькулятора, начиная от структуры HTML до стилей CSS, необходимых для его работы. Этот проект может быть интересен как начинающим, так и опытным веб-разработчикам, которые хотят улучшить свои навыки в создании веб-страниц без использования JavaScript.

https://blog.scottlogic.com/2022/01/20/noJS-making-a-calculator-in-pure-css-html.html

#html #css
👍10🤯9
Пишем одностраничное приложение с помощью htmx

JS-библиотеку htmx многие воспринимают как средство, которое спасает интернет от одностраничных приложений. Но автор этой статьи написал с помощью htmx простой список ToDo. После загрузки его страницы взаимодействие с сервером прекращается — всё остальное происходит локально на клиенте.

Как он это сделал? Выполнял серверный код в сервис-воркере. Сможете ли вы также? Конечно, мы вам даже инструкцию принесли:

https://habr.com/ru/companies/ruvds/articles/849854/

#htmx #javascript #html
👍3
This media is not supported in your browser
VIEW IN TELEGRAM
Стильный переключатель на чистом CSS

Этот свитч сделан с использованием чистых HTML и CSS. Никакого SVG. Посмотреть, как это работает можно на странице проекта:

https://codepen.io/josetxu/pen/NWEPmGz

#html #css #codepen
🔥27👍42
Как разобрать HTML в JavaScript

По мере роста спроса на данные растёт и потребность в их извлечении, обработке и анализе. Но большая часть этих данных представлена на веб-сайтах по всему интернету. Как же получить к ним доступ программно?

Решение заключается в автоматизации процесса анализа, извлечения и преобразования необработанных данных в структурированный, легко читаемый формат. Этот процесс известен как синтаксический анализ HTML, и в этой статье вы узнаете, как это сделать с помощью JavaScript.

#javascript #html #парсинг
🥰2
This media is not supported in your browser
VIEW IN TELEGRAM
Коллекция лоадеров и скелетонов для вашего проекта

В этой подборке содержится большое количество лоадеров самых разных стилей: радиальные, с точками, полосы загрузки и прочее. Также здесь есть несколько готовых скелетонов.

Все они выполнены на HTML и CSS с применением препроцессоров. Так что всё, что вам нужно сделать — скопировать их в свой проект.

#html #css #лоадер
👍82
Эффект матового стекла для веба

Разработчик, участвовавший в создании игр Forza, так вдохновился их элементами дизайна, что решил повторить их с помощью HTML. Конечно, без CSS тут тоже не обошлось, а где-то даже потребовался JS, но результат получился отличным.

Своим опытом и готовым проектом автор поделился в статье.

#html #css #ui
🔥12👍3
This media is not supported in your browser
VIEW IN TELEGRAM
Скрытые возможности элемента input

Большинство собратьев элемента input вне зависимости от своих атрибутов ведут себя одинаково. При этом атрибут type элемента input может принимать 22 разных значения, которые не только меняют его поведение, но и влияют на внешний вид.

Элемент input отвечает за всё, начиная с текстового ввода и чекбоксов, заканчивая переключателями и кнопкой для сброса всех полей в форме.

В этой статье описали не только различные типы input, но и сопутствующие атрибуты, о которых вы могли не знать, и которые делают этот элемент более удобным и применимым в различных ситуациях: https://habr.com/ru/companies/ruvds/articles/785690/

#html #лучшиепрактики
👍7
Forwarded from Типичный программист
Как парсить сайты в обход защиты от парсинга?

На некоторых сайтах работает защита от парсинга и работы ботов с ним. Но есть способы, которые позволяют обойти её и всё-таки добраться до содержимного веб-страниц.

На Хабре есть неплохой гайд. Делимся с вами: https://habr.com/ru/post/710982/

#linux #html #javascript #сsharp
👍10🔥51🥰1