[HTML/CSS] Верстаем очень простой сайт-визитку. Базовые знания для новичков. Верстка сайта с нуля.
ฝัง
- เผยแพร่เมื่อ 18 ม.ค. 2025
- От начала до конца создаем простейший сайт на основе шаблона, подходит для создания небольшого сайта-визитки или чего-то подобного. Работа скорей для обучения, нежели для реального применения, но знания полученные на подобных макетах позволят в ближайшее время брать более сложные шаблоны.
Спасибо тебе добрый человек за это замечательное видео! Я не знаю почему, но ютуб выдал мне твой ролик первым по запросу "Верстка простого сайта", но это просто идеальное видео для начинающих. У тебя отлично получается доходчиво все объяснять и благодаря твоему умению я сделал первый-маленький шажок в верстке, большое спасибо еще раз ))
С меня лайк и подписка)
Спасибо тебе за твою работу и за время которое ты потратил, чтобы это все сделать и рассказать, мне так помогает!!! Успеха тебе во всем!
привет у тебя есть код? Хотел скопировать, если есть можешь скинуть в соц.сеть?
Я охерел просто. Однозначно лайк и подписка. Увидел, как в живую все это верстается, завораживает, как автор умело быстро пишет код. Есть чему поучиться, спасибо)
На всех роликах этот комент..
Ты просто супер ! Ты самый идеальный для начинающего фронтендера учитель !
Столько видео роликов посмотрел не помогло, а тут сразу пошло и HTML и CSS сомо собой. Большой респект от кыргызского начинающего девелопера)
За работу с opacity отдельная благодарочка) начал макет верстать сам, без урока, и наткнулся на такую проблему, что текст тоже прозрачным становится,я уже и отдельным элементом делал, чтобы текст не наследовал прозрачность и с z-idnex игрался, и background через rgba пробовал делать, один хрен по тому же месту) ну что же, добра тебе, дядь)
Добрый человек, благословений тебе по жизни.
По моему лучшее объяснение для новичков что я встретил. Однозначно лайк
отличная тема! лайк от вебмастера и гуру по сео и не только СЕООНЛИ
Да, ваше мнение правильное. Канал является хорошим дополнением ко всем создателям контента или программистам. Спасибо за отличное объяснение. Я подписался на канал
лучшая дикция, все ясно и доходчиво, спасибо вам большое!
Спасибо, все просто и понятно! Установил для себя представление выстраивания )
Спасибо, мне как новичку очень полезно:)
Спасибо за видео! Узнал достаточно много нового с видео, удачи)
Cпасибо! Полезно и очень понятно! Очень помогло!
Блин, все объяснил понятно и коротко. Автору респект 👍
Благодарю , это было познавательно 👍
“И в итоге называется неправильным” 😅
Спасибо за урок. Как всегда с юмором и полезностями 😁
Хорошая работа, друг, без сомнения, программирование - лучшее!
Отличное видео для начинающих. Автору уважение за проделанную работу. 🤝👍💪 У меня тоже есть пример создания сайта в блокноте попроще конечно, но по шагам с исходником и коментами для скачивания. Кому интересно, забирайте.
Спасибо за классный урок !!!!
Спасибо за урок! Сделай еще верстку простого лэндинга, в таком же ритме, для начинающего)
Макс Максимыч хорошо, я думаю вернуться с подобными темами
Спасибо, все объяснил понятно и коротко!
Парень спасибо тебе огромное. Ты не представляешь какой я тупой, но у меня все получилось, делал 3 дня, ещё я узнал что есть среда для разработки вижен студио)). Очень интересно объясняешь, непонятно почему так мало подписчиков??
А те сайты которые верстал по вашим видео потом можно использовать во фрилансерком портфолио ?
40:20 почему - то не сработал а:hover меняет background только при нажатии. Почему не работает при наведении?
Может это мобильная / планшетная версия? Там такая особенность, что навести пальцем невозможно, только клик, а если в браузере эмулировать эту версию сайта то нужно только кликать. Других причин не знаю
@@temofart Спасибо за ответ.
Ваааау! Спасибо тебе большое! Так доходчиво и не спеша все рассказал и показал! Потрясающе!
Мощно! Благодарю!!
Не можу загрузити зображення на .userpic , роблю все так само, хоть з іншими фонами все добре, в чому проблема?
Да с узерпиг чот не то. У меня блок справа не встаёт вылезает снизу.
Порядочный пример создания странички .)
Однозначно лайк, спасибо.
Спасибо за урок!
PS: какой Вы красивый🙈
Спасибо☺️
Спасибо
Обьяснил все понятно.
Как у тебя поучится?
А что за редактор кода у тебя?
У меня почему то не включается Live Server. Подскажи, пожалуйста, почему? Плагин установил. Видео твое хорошее.
Сложно сказать, посмотри инструкции по свежим видео, может мое уже устарело
кинь свой плейлист
А как ещё можно вставить картинки? Просто я ставлю в html в title-block картинка та ставится но уже текст на стороне остается,а не на картинке. Подскажите пожалуйста, я хочу загруженную картинку вставлять в css ,а не через интернет.
удачи вам в развитии
Хотелось бы продолжения:)
Чувак ты ахуенный. Надеюсь не бросишь канал, у тебя все впереди
Ill.Uchiha9 Спасибо, планирую продолжать)
а это пойдет как проект на инфу? 9 класс я выбрал создание сайта с использованием кода HTML?
Спасибо.🙂
Хорошее видео, спасибо. Только голос чуть потише сделать стоит, а то музыку плохо слышно
помоги пожалуйста, у меня в sidebare SKILLS почему то относится к .nav ul backgraund. (Название Skills с рамкой от backgraund(( я не понимаю в чем проблема ((
Здравствуйте
Пишу код уже 5 час и на 46 минуте sidebar вообще не работает уже 30 минут сижу
Как можно с вами связаться, очень устал уже 3 часа ночи
Подскажите, пожалуйста, что мне делать, если я меняю файл CSS обновляю и стили не применяються?
Возможно вы забыли его подключить в или по указанному пути файла его не существует
обязательно ли навигационные ссылки делать посредством li ?
Kolyan ссылка делается с помощью и использовать li не обязательно. Это просто оболочка которая говорит что у нас "список" таких ссылок
@@temofart насколько ответственно указывать размер шрифта в пикселях? Не вызовет ли это проблемы при разных экранах?
@@grenadier1653 нет, никаких проблем при использовании пикселей нет. Ознакомьтесь с этой статьей:
medium.com/hackernoon/rems-and-ems-and-why-you-probably-dont-need-them-664b9ce1e09f
@@temofart Благодарю
@@grenadier1653 хороший вопрос
Что делать если background не работает
Спасибо))
что за программа?
vs code
очень круто)
Подскажите а как он тег моментально оборачивает в div и class? То есть он пишет просто nav, нажимает на кнопку и там сразу
Называется Emmet, встроенная фича в редакторах. У меня vs code, погугли как пользоваться
а зачем в sidebar прописывать ширину = 30%, если уже контейнеру прописал 70% ? Компутер сам посчитает
Очень классно, самый наверно адекватный обзор, но почему вы остановились и не продолжили наполнять страницы и завершить данный проект? Пожалуйста, я не хочу смотреть других авторов, как создавать страницы, их наполнение, пожалуйста сделайте это.
Я извиняюсь, вроде обучения с нуля, а как называется программа на котором ты работаешь?
Vscode
Не получается как не колдовал сделать ссілку изменяющей цвет по команде .nav li a:hover, что может быть, сделал все как у вас????
DaYrEn DAYS а попробуй проинспектировать ссылку и если браузер хром то в той области где описание стилей сверху есть кнопочка :hov. Там можно вручную имитировать hover и посмотреть какие стили применяются и что не так.
28:05 появляется новый div с классом title о котором ты не сказал, долго искал что за хуйня у меня творится...
полезное видео. Пожелание - фоновую музыку потише
Пишу url а он у меня не выделяется, что делать ??
Первый сайт хоть он и простой, но я впервые сделал до конца. Потому что у блогеров в начале обьясняют что такое h1 p долго мурыжат а когда уже идет сложно, они как понос бегут и нихера не понятно, 107 часов потрачено из которых половина в пустую
Кто может скинуть на почту готовый код? Я пробывал сделать но остановился на подвале . Рамка просто не отходит от боков сайта.
padding:100px 0 ; в body не работает
гг гг не может быть)
Я надеюсь в коде пробела нет перед точкой с запятой ?
@@temofart я тупо conteiner дал margin:50px auto и все ,
@@temofart не было вроде
@@гггг-щ9е надо margin: 50px;
Спасибо
Хорошее видео всё чётко только автор самое главное не указал программу на которой он работает ...
Классно
Спасибо , как раз искал что-то подходящие что бы стартануть !
Только пришлось в "reset .css" убрать margin чтобы анимация не дергалась...не знаю почему так , но для первого раза думаю пойдет.
mikebiryu.github.io/Mr.Cat/
Можешь скинуть готовый код архивом?
@@ВладиславЗотов-к4с напиши почту скину)
@@TheEegmen vladokzotov@yandex.ru
Здравствуйте, как вы сделали дополнительный переход, что бы переходить о Main info и остальным?
@@kerly3116 не понял о чем вы , если про открытие в новом окне , то - Ссылка откроется в новом окне
32:44
ul>li*3>a
=\
в какой программе это всё делать?
В любом блокноте. Я использую Sublime Text3
спасибо!
Капец из за того что я обнуляющий поставил ниже. padding у меня и не работал, а я думаю, все же переписал а не работает )
Кто не нашел шаблон, вот ссылка для вас - www.php-s.ru/templates/001/
одностраничники не каму не нужны дичь какая то
Необразованные тоже
ну это прям для детей
новичкам лучше не смотреть и не запоминать как делать неграмотно
автор даже сам это признаёт ниже
Да, лучше не смотри
@@temofart те*
Всё даже лёгким языком объяснил он, если вы не можете просто смотреть в видео где объяснили всё подробно то просто закройте видео и идите дальше. Не будьте душнилами.
@@sbmasterart1081 интересно через сколько лет до тебя дойдёт что автор неграмотно делает-показывает
@@Александр-н8х7н до вас *
Большое спасибо
Привет, подскажите пожалуйста в какой программе он пишет код ?
VS Code
@@Feedback576 благодарю
Все написал без ошибок, но ничего не отображается на моем сайте, просто белый фон и все, что делать?
Я ж не Ванга чтобы определить) Наверняка ошибка есть, нужно видеть код. Попробуй открыть вручную в браузере тот файл html в котором пишешь код, возможно не тот открыт.
@@temofart та пробовал уже 3 раза, и код по новому переписывал( Даже не знаю в чем проблема
@@Vladyslav_81 если написать в index.html какие-то теги с текстом и открыть этот файл в браузере там по-любому что-то будет.
@@temofart Спасибо, а как сделать для каждой кнопки разный текст?
Спасибо!