html
(70)
7 корисних атрибутів HTML, про які ви могли не знати
HTML — наріжний камінь веброзробки. Однак багато початківців ознайомлюються з ним лише поверхнево і переходять до CSS, JS тощо, втрачаючи весь потенціал HTML. Тож розгляньмо перелік атрибутів HTML, про які багато новачків не знають, але які можуть бу...
Codeguida · 07 жовтня 2021 · 20
Навігація списком
Дійшовши до створення меню навігації, більшість web-розробників реалізують код таким чином: <nav> <ul> <li><a href="#">Home</a></li> <li><a href="#">Products</a></li> <li><a href="#">Services</a></li> <li><a href="#">...
Codeguida · 11 жовтня 2021 · 4 · 1
Адаптивні зображення: використання srcset
Якщо Ви почати використовувати адаптивні зображення (різні зображення в HTML для різних ситуацій) і все, що Ви робите, це перемикаєтесь між різними версіями одного і того ж зображення (найпопулярніший варіант), все, що Вам потрібно, - це атрибут srcs...
Codeguida · 18 листопада 2020 · 15
Використання SVG для стиснення ваших PNG зображень
Чи не було б чудово отримати стиснений JPEG і зберегти прозорість у PNG? І це реально. Ось невеликий трюк, який я відкрив, коли працював на новому сайті Sapporo Beer. Зверніть, що пиво на сайті Sapporo має прозору зону(це важко помітити). У форматі...
Codeguida · 13 січня 2021 · 1
Ефективність табуляції та пробілів в HTML
Як ви робите відступи у вашій розмітці? З допомогою табуляції чи пропуску? Невже це важливо для продуктивності? Давайте проведемо експеримент. Розглянемо сторінку, яка створює список з 50-ти предметів: <ul> @for (int i = 0; i < 50; i++)...
Codeguida · 30 серпня 2020 · 13
Використовуємо будь-який рядок як колір в HTML
Чи знаєте ви, що будь-який рядок може бути використаний в якості коду кольору для HTML? Наприклад: У наведеному вище прикладі браузер приймає "chucknorris" як колір rgb(192, 0, 0) і застосовує його для тега body. Давайте спробуємо використати інші і...
Codeguida · 30 грудня 2021 · 9
Вертикальне і горизонтальне центрування за допомогою CSS3 transform
Центрувати елементи по горизонталі не складно, але вертикальне вирівнювання завжди було трохи заплутаним. У цій статті я покажу вам, як центрувати по вертикалі і по горизонталі за допомогою CSS3 transform. {full-post-img} Я створив для цього клас .c...
Codeguida · 13 січня 2020 · 21
nanobar.js - прогрес-бар без JQuery
Приклад: var options = { bg: '#acf', target: document.getElementById('myDivId'), id: 'mynano' }; var nanobar = new Nanobar( options ); nanobar.go( 30 ); // size bar 30% nanobar.go(100); Інст...
Codeguida · 26 листопада 2020
Організації W3C та WHATWG разом працюватимуть над HTML і DOM
Організації W3C та WHATWG підписали угоду про спільний розвиток специфікацій HTML й DOM. Нагадаємо, WHATWG — це група, створена компаніями Apple, Mozilla та Opera як альтернатива організації W3C. W3C вважала, що майбутнє за XML і XHTML, тоді як WHATW...
Codeguida · 4 роки тому
Ефекти стиснення в порівнянні з мінімізацією HTML файлів
Минулого разу ми розглянули вплив на продуктивність використання табуляції та пробілів в HTML. Виникло нове питання: Чи варто використовувати зменшення HTML файлу, коли вже використовуєш GZip. Давайте проведемо експеримент. Я зібрав декілька реальних...
Codeguida · 12 січня 2021 · 4