Верстка страницы на примере реального макета ЧАСТЬ 3. | Верстка макета FIGMA с объяснением
Вставка
- Опубліковано 26 вер 2024
- В этом видео мы задаем и оптимизируем стили для текста в макете.
Макет взят на просторах интернета и находится в свободном доступе.
Ссылка на макет:
www.figma.com/...
Ссылка на файлы проекта:
github.com/Kir...
t.me/tutproweb - Телеграмм-канал с "печеньками" и "плюшками"
----------------------------------------------------------------------------------------------------------------
Поддержи канал:
PayPal
www.paypal.com...
или по почте - inweb@ua.fm
Patreon
/ tutproweb
Donatello
donatello.to/p...
Crypto
USDT (TRC20): TKEmeUR2CdSDxd5D8RCHAr95jMmtAF6nhq
На просмотре єтого видео и закончилась последовательная логическая цепочка в моей голове( А так все хорошо начиналось)(
Привет! Делаешь крутой контент)). Когда выйдет последняя часть?
Уже записано и монтируется. Завтра утром будет на канале!)
Приветствую!!Начинаю с нуля! 1е 2 части понятные, а вот с 3й частью уже не понятно как и где и что ты подключал????
где ссылки на сайты, как подключать те или иные ссылки, также шрифты и т.д.
Приветствую, Олег.
Ознакомиться с файлами проекта можно по ссылке в описании.
Как подключены шрифты показано. Если нужно детальнее - на канале есть отдельное видео.
Как подключать те или иные ссылки куда? На картинки? на файлы стилей? На другие сайты? Непонятно.
Ответить на вопрос про ссылки сайты не могу - не пойму о каких сайтах идет речь.
Видео имеет целью показать один из вариантов процесса верстки страниц. Я проговаривал многие моменты, но все если нужно детально изучить что-то конкретное, например как подключать шрифты, - нужно смотреть видео именно на эту тему.
Я про fonts.css где и как ты это все взял что там написано, просто скачать у тебя скачать это понятно что можно, но я б хотел понять как это пишется и все в этом роде! просто на этом я остановился и не стал дальше ничего смотреть не понятно от куда все это было взято. Ну да ладно, в общем спасибо тебе труды и развивай канал дальше все ок!!!
@@tutproweb
Так подключаются локальные шрифты. Подробнее можно найти в видео ua-cam.com/video/Jz8Gm71yuCI/v-deo.html
Там во второй части видео рассказываю как подключаются файлы шрифтов локально в проект. Не стал дублировать всю информацию, так как она уже есть на канале.
Спасибо за видео, осталось несколько вопросов:
1. Использование селекторов по тегам в БЭМ не рекомендуется, но в этом видео используется. Почему?
2. Почему вы задали названия классов блоков, описывая их внешний вид: btn-blue, btn-transparent. По БЭМу это же моветон, разве нет?
3. Почему в .section-title line-height: 125%, если по макету для заголовка "Хватит тратить своё время в очередях" line-height: 115% ??
Приветствую.
1. Так как я не подключал ни reret.css, ни normalize.css записал стили сброса(нормализации) некоторым тегам, чтобы не дублировать в каждом элементе.
2. btn-blue, btn-transparent - это визуальные компоненты и повторяются несколько раз, так что решил вынести в отдельные блоки. В принципе это не запрещено.
3. В остальных заголовках 125%, это скорее всего просто невнимательность дизайнера. Этот параметр сильно никак не влияет на визуал и поэтому решил сделать все заголовки одинаковые.
@@tutproweb
2. С блоками всë ясно. Просто немного не понятно почему в названиях классов вы описали их внешний вид (blue, transparent). В таких случаях данные названия допустимы?
Да. Подписал так, чтобы по названию было понятно что за компонент.
@@tutproweb
Хорошо, спасибо!