Ребята, надеюсь выпуск понравился! Появилась возможность поодержать канал: www.patreon.com/freelancerlifestyle И еще пара полезных ссылок: Чат по верстке: t.me/flschat Instagram: instagram.com/freelancer.lifestyle Telegram канал: t.me/freelancer_lifestyle Facebook: facebook.com/freelancerlifestyle
Когда добавляю стрелку в кнопку, после .textbutton span:after{ могу ее сдвигать при помощи padding только по горизонтали. Как сдвинуть по вертикали подскажите пожалуйста, 3 день не могу разобрать
Жень, да как ты вообще можешь говорить "надеюсь, выпуск был полезен"??? Все твои видео просто на вес золота!!! Они просто не могут быть не полезными!!! Спасибо за твою работу!!!
Полностью согласен!!! Единственный канал который так затянул что без лени каждый день по 3-4 ролика смотрю, топовый разбор каждого момента, отличные домашки для закрепления, и просто лучшее объяснение!!!!!!!!!!!
Дядя Ты с какой планеты родом??? С такой подачей инфы надо тебе занимать должность менистра образования! Коротко, по существу и наглядно. Просто красавчегггг!!!
Привет. По поводу галочки, вот что получилось у меня. 1 вариант - скачать иконки двух цветов, и добавить зеленую в изначальный список с помощью before и свойства background image, но при этом указать еще внутренний левый отступ пикселей на 10-20 (смотря какая у вас по величине картинка, там можно играть, но паддинг добавить обязательно, иначе при обновлении браузера картинки не видно), а уже когда мы добавляем hover, то в background добавить вторую картинку с красной галочкой и поменять цвет текста на красный. 2 вариант - с помощью свойства content и добавления в него галочки из эмодзи (у меня вызывается клавишами windows + ' ; ' (ну или там где русская ж на клавиатуре, опять же это у меня так)). Так вот, в эмодзи есть и галочка и стрелочки и разные другие символы, включая кавычки, которые легко вставляются в content и им можно менять цвет свойством color. Опять же в изначальном списке я указала зеленый, а при наведении - красный. Единственный недостаток имеющихся эмодзи - это маленький выбор, там нет кучи вариантов стилей галочки или стрелки, но как вариант работает.
Хорошая подача материала, все отлично!) За инфу в формате блокнота👨🏽💻, огромное спасибо)))). Я когда учил, то сам все искал, а тут все в сжатом максимально удобном формате, очень крутая идея👍👍👍). 😊
У меня прогресс на лицо. Раньше Ваш урок длительностью 15 минут я усваивала два часа. Данный урок я усвоила минут за 40. Спасибо. Вы очень талантливо делаете большое и нужное дело.
Жека! Спасибо наконец-то ты единственный Препод, который рил объясняет все тонкости! И наконец-то я понял про "before and after". Thank, you! I wait to your videos!
Евгений, благодарю Вас за такую бескорыстную подачу материала , очень объемно и исчерпывающе , мне 37 и я без труда все понимаю, но вы дали более короткую дорогу в Iti сферу которую я откладывал всю жизнь .В этот праздник желаю Вам благополучия и процветания, я каждый день учусь с Вами и благодарен тому что вы есть на просторах интернета.
Передивила багато контенту, аби зрозуміти для чого ж потрібні псевдоелементи. Лише Женя зміг пояснити все зрозумілою мовою, і тепер я можу рухатися далі. Дякую) Це дійсно крутяк)
🥰Просто нет слов!!! 😊Стараюсь посмотреть каждое видео, 🤗 некоторые пересматриваю😇 и первым делом смотрю поставил ли я лайк, 😅если нет, ставлю. И со спокойной душой продолжаю просмотр. 🤩 Спасибочки!!! Бесконечно БЛАГОДАРЕН Автору🤗🤗🤗
Дуже дякую за вашу працю і за хорошу подачу матеріалу. Люблю дивитися ваші відео. Сподіваюся стати схожим на вас. Дякую, що ділитеся своїм досвідом з людьми.ВЕЛИКЕ СПАСИБІ!!!
Жека, моё почтение! У тебя дар доносить до мозга не доносимое другими. Умеешь объяснить, рассказать, научить. Нельзя не поставить лайк! Жека, смотрю, изучаю, внедряю)
Наверное единственный автор, который так доступно и приятно объясняет, что понятно ,даже когда кушаю во время просмотра) Спасибо большое! очень жду занятия по JS)
Евгению очередная благодарность за замечательную подачу и подготовку материала! К прилежно выполняющим задание (может быть, уже не столь актуально, но наверняка я не одна пришла на канал не сразу) вопрос: допустимо ли так решать вопрос с маркерами-галками (использовать боковой марджин)? Визуально так работает. /*Проставление маркера*/ .list li::before { content: url(img/check.png); margin-right: 10px; } /*Замена маркера на красный*/ .list li:nth-child(2):hover::before { content: url(img/check_red.png); } Если опустить "пиксел-перфект", т.к. не это задача текущего урока, и не пытаться чуть поднять-опустить маркеры, визуально так все работает. Таким же образом сделала и стрелку. Но сдвинуть вверх-вниз изученными к 11 уроку средствами не удается. На стрелке это очень заметно. Да, я понимаю, как это сделать еще не изученными способами, но реально ли выровнять тем, что известно за 11 уроков с начала курса? Кроме того, не увидела, чтобы кто-то писал о том, что у стрелки есть opacity 0.8 и в этом задании, и в предыдущих. Но это мы не разбирали ни на стриме разбора верстки простой страницы (хотя там opacity был и у большого фонового изображения) и ни у кого в примерах не нашла, чтобы кто-то пытался это реализовать.
Женя, спасибо тебе большое, во время обучения я как будто чувствую твоё присутствие, полное погружение и как будто индивидуально для меня все показываешь, изучение идет как по маслу и с улыбкой на лице
Очень доходчиво объяснил такую непростую тему. Супер! "надеюсь, выпуск был полезен"??? , за это переживает человек который отдельно кавычки выложил. Это бомбический уровень. Некоторые страница из учебника зачитали, скрин кода показали, а дальше плавай сам, разбирайся как знаешь. А тут человек КАВЫЧКИ выложил. О.май, гад!!!!!!!!
подсмотрел как добавить списку через ::before галочки которые бэкграунд, оказалось положение и no-repeat после url() у меня были лишними а так все верно, спасибо за подсказку.
Слушая Вас, понимаешь о чём говорите и при этом нет напрягов, а просто отдых. смотрю-понимаю-делаю 3 минуты перерыва, чтобы улеглось в памяти, потом!!! словами не описать какая благодать от Вас нам, желающих учиться
*Огромнейшее тебе спасибо! Благодаря твоим урокам шагаю семимильными шагами к созданию собственного сайта) А твой обнуляющий код - это просто вишенка на этом полезном торте из видеоуроков)*
Я наверное под каждым уроком буду писать спасибо, особенно за краткие конспекты!!!! Это просто находка, забыл что-то открыл и посмотрел, не надо видео пересматривать и искать нужное место!
Эвгене, якби всі мої викладачі в універі так давали інформацію свого часу, я би вже давно працювала за спеціальністю! Дуже корисно і позитивно! Велике дякую!!!!!!!!!!!!!!!!!!!!!!!!!!
Лучший... нет, ну, честно - это лучшие уроки на ютубе, что я находил. Начинал учиться раза 4 и всякий раз словно головой кирпичную стену пытался пробить. В последний раз не мог разобраться с SASS и нашел твоё видео на эту тему. Правда, тогда в очередной раз забросил, но на этот раз решил сразу начать с твоих уроков. Самое лучшее, что ты не просто говоришь, что делать, но и объясняешь, как оно работает. Я наконец-то начал по-настоящему всё понимать. Искренне и от души спасибо!
Никогда не получал такого удовольствия от обучения (а за плечами университеты и институты)! А фишка, я думаю, в том, что всё понятно , а значит методология изложения продумана и логична. Женя, спасибо за труды ! Лайк !
Как же мне повезло с тем, что я, начинающий верстальщик, наткнулся на ваш канал. Я очень, очень и очень сильно благодарен за ваш труд, который вы предоставляете абсолютно бесплатно! Я просто в шоке. За всю мою жизнь я впервые вижу канал, видео на котором невозможно найти негативный комментарий! А ведь вы не то что просто предоставляете это бесплатно, но и отвечаете на комментарии, оставляете в текстовом блокноте и на своем сайте информацию о уроке. Надеюсь таких людей как вы, будет больше! И еще раз огромное спасибо за все, что вы для нас делаете.
Огромное тебе спасибо за то что ты делишься знаниями накопленными годами и делаешь это без возмездно. Твой канал лучший на RUclips для верстальщика многие платные курсы дают уровень знаний сильно хуже. Недостаточно хорошо знать программирования нужно уметь подавать информацию нужно быть учителем у тебя это прекрасно получается спасибо за твой канал
о качестве уроков говорят дизлайки конкурентов. ну не может же нормальный человек этому видео поставить минус. а если считаете что сделал заслуженно - объяснить же надо за что минус.
Радует, что весь код работает во время занятий по видео и после, когда повторяешь заново уже самостоятельно. Подача информации без ошибок, наличие шпаргалок и технического материала играют важную роль в обучении, которая становиться в разы быстрее, чем учиться по книжке. Ps.домашка удалась, кроме одного: не могу изменить chek.png при наведении мышкой.
Женя! Огромное тебе спасибо!!! Действительно, только после твоего видео стало понятно про before и after! Теперь буду частым гостем на твоём канале! СПАСИБО !!!
Жека, ты лучший! Реально самый крутой курс из тех, что смотрел. Отличная подача материала, никакой лишней болтовни и заумных фраз, все четко и по делу. При этом все сразу становится понятно + тут же домашка для закрепления материала. Спасибо и успехов тебе!
Видео обязательно вечером посмотрю. Но хочу напомнить про две более лайтовые темы: правильное обозначение классов и подключение шрифтов к проекту. Было бы интересно посмотреть и понять как это делается, а то в инете куча ненужной инфы идет рядом и суть теряется. А ты всегда по делу говоришь! Так что спасибо за это видео, и ждем следующие по темам!)
Женя, я в восхищении! Я немного знакома с версткой, но все равно смотрю сейчас уроки с самого начала на случай новой информации. В каждом уроке такое находится, но на ms-clear и moz-focuz я просто запищала от восторга. Не столько даже с них, столько с того, что вам реально не жалко делиться такими вот локальными лайфхаками на этапе, казалось бы, для совсем начинающих. Сразу видно, как вас самого с этого прет и что вы действительно хотите научить полезному, а не плодить дураков, лишь бы платили)). Это супер, это большая редкость.
Я в восторге от уроков,слушать легко и приятно. Переслушал много разных авторов,и платных и бесплатных,здесь работать комфортнее всего. Вам,уважаемый автор желаю побыстрее закатать свой плейлист видеоуроков на какой нибуть UDEMI и заработать много бабосов))
Я просто в восторге! Сейчас получила огромное удовольствие от Вашего урока! Вы самый лучший педагог в моей жизни!!!!! Вы меня вдохновляете учиться каждый день!
И таки, начало кое-что ПОЛУЧАТЬСЯ! Объясняете Вы потрясающе!!! Очень здорово! А раньше - я даже не смотрела в эту сторону, считая, что программирование для меня "недоступно"... Да это, оказывается так ЗДОРОВО и ИНТЕРЕСНО!!!🌈
Снова видео-урок и снова я удивлен... Спасибо Вам, Евгений, за лаконичность и информативность. Раньше я знал только о двух псевдо-элементах - 'before' и 'after'. Теперь узнал о новых и занес их в свою копилку знаний. Очередной заслуженный ЛАЙК за годный урок.
Я так долго искала как вставлять символы типа значок телефона перед номером. Или раскраску пунктов в меню (в CMS нельзя html кодом играться). Можно найти готовый код и вставить. А здесь так четко. Спасибо большое за уроки! У Вас отличная структура подачи знаний!
Ребята, надеюсь выпуск понравился!
Появилась возможность поодержать канал:
www.patreon.com/freelancerlifestyle
И еще пара полезных ссылок:
Чат по верстке: t.me/flschat
Instagram: instagram.com/freelancer.lifestyle
Telegram канал: t.me/freelancer_lifestyle
Facebook: facebook.com/freelancerlifestyle
Можешь свои стримы на канал заливать по вёрстке,а то я в график не вписываюсь,пожалуйста)
Когда добавляю стрелку в кнопку, после
.textbutton span:after{
могу ее сдвигать при помощи padding только по горизонтали.
Как сдвинуть по вертикали подскажите пожалуйста, 3 день не могу разобрать
@@АртурЗлатарёв-к7т попробуй, display:inline-block
@@АртурЗлатарёв-к7т попробуй возможно paddinng:bottom;
Як через before поставити пнг картинку в кнопку, я не можу цю стрілку поставити, я вказую розмір і так далі, але нічого не виходить
Жень, да как ты вообще можешь говорить "надеюсь, выпуск был полезен"??? Все твои видео просто на вес золота!!! Они просто не могут быть не полезными!!! Спасибо за твою работу!!!
Я рад! Пожалуйста!
Полностью согласен!!! Единственный канал который так затянул что без лени каждый день по 3-4 ролика смотрю, топовый разбор каждого момента, отличные домашки для закрепления, и просто лучшее объяснение!!!!!!!!!!!
Согласна на все 100%)
++++++
Дядя Ты с какой планеты родом??? С такой подачей инфы надо тебе занимать должность менистра образования! Коротко, по существу и наглядно. Просто красавчегггг!!!
Хех, спасибо!
@@TOP5-f4i7t он казах
мЕнистры образования они такие, да...
@@АндрейЦиуляну угу...прям в точку
Наконец-то хоть кто-то понятно объяснил про before и after, спасибо, Жека!
Спасибо!
Не говори , столько искал подробной инфы на счёт бефор и афтер
Твой канал просто находка для начинающего верстальщика🙂!Хочу поблагодарить за
труд, который ты делаешь!!
Спасибо большое!
Привет, можешь сказать, как сейчас у тебя обстоят дела с веб-разработкой? Было бы интересно узнать
Привет. По поводу галочки, вот что получилось у меня.
1 вариант - скачать иконки двух цветов, и добавить зеленую в изначальный список с помощью before и свойства background image, но при этом указать еще внутренний левый отступ пикселей на 10-20 (смотря какая у вас по величине картинка, там можно играть, но паддинг добавить обязательно, иначе при обновлении браузера картинки не видно), а уже когда мы добавляем hover, то в background добавить вторую картинку с красной галочкой и поменять цвет текста на красный.
2 вариант - с помощью свойства content и добавления в него галочки из эмодзи (у меня вызывается клавишами windows + ' ; ' (ну или там где русская ж на клавиатуре, опять же это у меня так)).
Так вот, в эмодзи есть и галочка и стрелочки и разные другие символы, включая кавычки, которые легко вставляются в content и им можно менять цвет свойством color. Опять же в изначальном списке я указала зеленый, а при наведении - красный.
Единственный недостаток имеющихся эмодзи - это маленький выбор, там нет кучи вариантов стилей галочки или стрелки, но как вариант работает.
Может повторюсь но отдельное спасибо за обнуляющие стили.
Пожалуйста!
Хорошая подача материала, все отлично!) За инфу в формате блокнота👨🏽💻, огромное спасибо)))). Я когда учил, то сам все искал, а тут все в сжатом максимально удобном формате, очень крутая идея👍👍👍). 😊
Спасибо большое! Стараюсь!
Приятно учиться! Появляется настоящая надежда стать Верстальщиком и работать на бирже заказов! Огромное спасибо Вам!!!
Спасибо! Рад что полезно!
Как успехи?
и как там дела с твоей мечтой?
@@musicalbox6069 плохо
У меня прогресс на лицо. Раньше Ваш урок длительностью 15 минут я усваивала два часа. Данный урок я усвоила минут за 40. Спасибо. Вы очень талантливо делаете большое и нужное дело.
Спасибо за труд! Я просто поражаюсь сколько в этот канал вложено сил и денег! И всё ради людей! Ещё раз спасибо!!!
Это да! Пожалуйста!
НЕТ КОММЕНТАРИЕВ, СМОТРЮ УЖЕ 11 УРОК И МНЕ ЭТО НРАВИТЬСЯ! ты очень хорошо объясняешь! спасибо что ты захотел нас *бесплатно* обучить! лучший!
Євгене, роки йдуть, а ваші відео не перестають дивитись! Дякую!
Ты просто красава) столько сил вложил в канал, сейчас изучаю все это и понимаю что для бесплатного курса это просто шикарно, благодарю тебя.
Результат бар ма?
Я тоже изучаю сейчас
Величезне!!! Велиииичееееезнееее дякуюююю тобі за обнулюючий список!
Насправді, це величезний подарунок!
Жень, спасибо тебе огромное. Ты мне как отец, в любом случае выручишь.
Спасибо!
Жека! Спасибо наконец-то ты единственный Препод, который рил объясняет все тонкости! И наконец-то я понял про "before and after". Thank, you! I wait to your videos!
Супер! Спасибо! 🤘
*wait for
:)
@@gen6885 А еще лучше I'm waiting for your videos!
Впервые смотрю такие полезные видосы про HTML и CSS с таким классным объяснением!!!
Спасибо! Я рад что полезно!
Евгений, благодарю Вас за такую бескорыстную подачу материала , очень объемно и исчерпывающе , мне 37 и я без труда все понимаю, но вы дали более короткую дорогу в Iti сферу которую я откладывал всю жизнь .В этот праздник желаю Вам благополучия и процветания, я каждый день учусь с Вами и благодарен тому что вы есть на просторах интернета.
Боже ты такой классный, ты даёшь информацию интересно, просто и запоминающе!
Спасибо!
Окрема подяка за обнулення! Це реальна крута фішка!
Передивила багато контенту, аби зрозуміти для чого ж потрібні псевдоелементи. Лише Женя зміг пояснити все зрозумілою мовою, і тепер я можу рухатися далі. Дякую) Це дійсно крутяк)
Дякую! Це надихає!
Один из лучших каналов про верстку. Автор всегда доступно расставит все по полочкам.
Огромная огромная огромная благодарность за видео!!!!!!!!!!!
Пожалуйста!
Дякую за твої уроки, вони всі корисні, а головне зрозумілі та зроблені з душею.
🥰Просто нет слов!!! 😊Стараюсь посмотреть каждое видео, 🤗 некоторые пересматриваю😇 и первым делом смотрю поставил ли я лайк, 😅если нет, ставлю. И со спокойной душой продолжаю просмотр. 🤩 Спасибочки!!! Бесконечно БЛАГОДАРЕН Автору🤗🤗🤗
Дуже дякую за вашу працю і за хорошу подачу матеріалу. Люблю дивитися ваші відео. Сподіваюся стати схожим на вас. Дякую, що ділитеся своїм досвідом з людьми.ВЕЛИКЕ СПАСИБІ!!!
Жека, моё почтение! У тебя дар доносить до мозга не доносимое другими. Умеешь объяснить, рассказать, научить. Нельзя не поставить лайк! Жека, смотрю, изучаю, внедряю)
Спасибо! Стараюсь) Рад что полезно!
Наверное единственный автор, который так доступно и приятно объясняет, что понятно ,даже когда кушаю во время просмотра) Спасибо большое! очень жду занятия по JS)
Я тоже
Евгению очередная благодарность за замечательную подачу и подготовку материала! К прилежно выполняющим задание (может быть, уже не столь актуально, но наверняка я не одна пришла на канал не сразу) вопрос: допустимо ли так решать вопрос с маркерами-галками (использовать боковой марджин)? Визуально так работает.
/*Проставление маркера*/
.list li::before {
content: url(img/check.png);
margin-right: 10px;
}
/*Замена маркера на красный*/
.list li:nth-child(2):hover::before {
content: url(img/check_red.png);
}
Если опустить "пиксел-перфект", т.к. не это задача текущего урока, и не пытаться чуть поднять-опустить маркеры, визуально так все работает. Таким же образом сделала и стрелку. Но сдвинуть вверх-вниз изученными к 11 уроку средствами не удается. На стрелке это очень заметно. Да, я понимаю, как это сделать еще не изученными способами, но реально ли выровнять тем, что известно за 11 уроков с начала курса?
Кроме того, не увидела, чтобы кто-то писал о том, что у стрелки есть opacity 0.8 и в этом задании, и в предыдущих. Но это мы не разбирали ни на стриме разбора верстки простой страницы (хотя там opacity был и у большого фонового изображения) и ни у кого в примерах не нашла, чтобы кто-то пытался это реализовать.
Женя, спасибо тебе большое, во время обучения я как будто чувствую твоё присутствие, полное погружение и как будто индивидуально для меня все показываешь, изучение идет как по маслу и с улыбкой на лице
Супер! Именно этого я и хотел! 👍👍👍
Очень доходчиво объяснил такую непростую тему. Супер! "надеюсь, выпуск был полезен"??? , за это переживает человек который отдельно кавычки выложил. Это бомбический уровень. Некоторые страница из учебника зачитали, скрин кода показали, а дальше плавай сам, разбирайся как знаешь. А тут человек КАВЫЧКИ выложил. О.май, гад!!!!!!!!
У меня была проблема как через псевдоелемент before сделать так чтобы галочка становилась красным. Решение оказалось банальным, нужно правильно писать последовательность псевдокласса и псевдоелемента. Делюсь вам для возможной проверки уже решенной домашки. P.S когда будете вставлять мой код, то чтобы стрелочка и галочка появились, не забудьте их выкачать - поместить в папку - и отредактировать в моем коде путь к этим иконкам и картинкам ( может кто не знает то это " url()" )
код html:
Стилизируй с помощью псевдоклассов и псевдоэлементов
Put on this page information about your product
A detailed description of your product
Tell us about the advantages and merits
Associate the page with the payment system
Full Story
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet tempore fuga dicta neque, laudan
tium ratione nemo architecto tempora consequatur, officia corporis. Officia atque ex minima ac
cusantium eius ea excepturi incidunt.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet tempore fuga dicta neque, laudan
tium ratione nemo architecto tempora consequatur, officia corporis. Officia atque ex minima ac
cusantium eius ea excepturi incidunt.
Код CSS:
/*Обнуление*/
*{
padding: 0;
margin: 0;
border: 0;
}
*,*:before,*:after{
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
:focus,:active{outline: none;}
a:focus,a:active{outline: none;}
nav,footer,header,aside{display: block;}
html,body{
height: 100%;
width: 100%;
font-size: 100%;
line-height: 1;
font-size: 14px;
-ms-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
input,button,textarea{font-family:inherit;}
input::-ms-clear{display: none;}
button{cursor: pointer;}
button::-moz-focus-inner {padding:0;border:0;}
a, a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
ul li{list-style: none;}
img{vertical-align: top;}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight: 400;}
/*--------------------*/
body{
background-color: @/e8e8e8;
width: 1440px;
height: 1700px;
}
.cummonbody {
padding: 125px 308px 103px 290px;
}
.checkicons_text {
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-size: 20px;
}
.check_title {
font-size: 14px;
color: @/000000;
line-height: 40px;
text-transform: uppercase;
letter-spacing: 2.8px;
}
.check_text li:nth-child(1){
color: @/273d46;
line-height: 36px;
text-align: left;
text-decoration: line-through;
}
.check_text li:nth-child(2){
color: @/273d46;
font-weight: bold;
line-height: 36px;
text-align: left;
}
.check_text li:nth-child(3){
color: @/273d46;
font-style: italic;
line-height: 36px;
text-align: left;
}
.check_text li:nth-child(4){
color: @/273d46;
line-height: 36px;
text-align: left;
text-transform: uppercase;
}
.check_text li:before{
content: url('../img/DZ/icons/check_icon.png');
padding: 0px 10px 0 0;
}
.check_text li:nth-child(1):hover{
color: @/273d46;
line-height: 36px;
text-decoration: none;
}
.check_text li:nth-child(2):hover{
color: @/d55a5a;
font-weight: 400;
}
.check_text li:nth-child(3):hover{
font-style: normal;
}
.check_text li:nth-child(4):hover{
text-transform: none;
}
.check_text li:nth-child(2):hover:before{
content: url('../img/DZ/icons/check_icon_red.png');
padding: 0px 10px 0 0;
}
.check_text{
margin-bottom: 137px;
}
.link_button{
border-radius: 24px;
display: inline-block;
height: 44px;
box-shadow: 0 6px 40px rgba(128, 183, 179, 0.54);
margin-bottom: 118px;
background-color: @/80b7b3;
}
.link-link {
display: inline-block;
padding:2px 35px 0 30px;
}
.link-link span:after{
content: url('../img/DZ/icons/strelca.svg');
position: relative;
left:9px;
top:2px;
}
.link-link span{
display: inline-block;
color: @/ffffff;
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
line-height: 40px;
text-transform: uppercase;
letter-spacing: 2.8px;
}
.link_button:hover{
background-color: @/3a5856;
}
.link_button:active{
background-color: @/818181;
}
.text p:nth-child(1):first-line{
color: red;
}
.text p:nth-child(1){
margin-bottom: 43px;
}
.text p:nth-child(2):first-letter{
color: red;
font-size: 26px;
}
.text{
font-size: 18px;
}
Спасибо.)
Уточил, для себя, некоторые элементы.
Плюс Вам в карму, однозначно.))
Спасибо большущее! Что только не делала с этой галочкой)
подсмотрел как добавить списку через ::before галочки которые бэкграунд, оказалось положение и no-repeat после url() у меня были лишними а так все верно, спасибо за подсказку.
Этот метод уже не рабочий по ходу да
Зміг замінити на нову червону галочку. Але, здається, є спосіб змінити колір в коді CSS. Хтось знає як це зробити?
Этот курс будут смотреть еще наши дети, так что спасибо за твой большой труд❤
Нарадоваться не могу, что когда-то наткнулся на этот канал. Спасибо, Жека, за труды твои) отличная подача материала) Всех благ.
Доходчиво человек объяснил про данные псевдоэлементы. Очень полезное видео. Спасибо.
Пожалуйста!
Спасибо за урок! Отлично, ка всегда! «Кавыкчкчки» alt+0171 alt+0187 на num-паде (alt надо держать).
Очень полезно даже для программиста с большим стажем!
Просто быстро и понятно!
Благодарю!
Спасибо Женя! За 14 минут доступно объяснил эту тему, которая мне за несколько часов самостоятельного штудирования не зашла.
Супер! Я рад!
Женя, спасибо огромное в сотый раз! Добра тебе и твоему дому, обнял!
Как всегда всё только по теме, ничего лишнего! Спасибо!
Спасибо, старался)
Слушая Вас, понимаешь о чём говорите и при этом нет напрягов, а просто отдых. смотрю-понимаю-делаю 3 минуты перерыва, чтобы улеглось в памяти, потом!!! словами не описать
какая благодать от Вас нам, желающих учиться
*Огромнейшее тебе спасибо! Благодаря твоим урокам шагаю семимильными шагами к созданию собственного сайта) А твой обнуляющий код - это просто вишенка на этом полезном торте из видеоуроков)*
Я наверное под каждым уроком буду писать спасибо, особенно за краткие конспекты!!!! Это просто находка, забыл что-то открыл и посмотрел, не надо видео пересматривать и искать нужное место!
Учу html и css, тут хорошо объясняют да ещё и домашка есть) спасибо что стараешься;)
Пожалуйста!
Эвгене, якби всі мої викладачі в універі так давали інформацію свого часу, я би вже давно працювала за спеціальністю! Дуже корисно і позитивно! Велике дякую!!!!!!!!!!!!!!!!!!!!!!!!!!
Будь ласка
Действительно Евгений!!!, со своим видео-обучающим каналом, находка для начинающего верстальщика. Будь здоров и
Спасибо!
Обнуляющий стиль бесценен, как и весь контент от Евгения!!!!
Женя, очень вас благодарю за прекрасные и понятные уроки
Лучший... нет, ну, честно - это лучшие уроки на ютубе, что я находил. Начинал учиться раза 4 и всякий раз словно головой кирпичную стену пытался пробить. В последний раз не мог разобраться с SASS и нашел твоё видео на эту тему. Правда, тогда в очередной раз забросил, но на этот раз решил сразу начать с твоих уроков. Самое лучшее, что ты не просто говоришь, что делать, но и объясняешь, как оно работает. Я наконец-то начал по-настоящему всё понимать. Искренне и от души спасибо!
:hover: before впечатлило, спасибо за урок и Ваши советы.
Пожалуйста!
Никогда не получал такого удовольствия от обучения (а за плечами университеты и институты)! А фишка, я думаю, в том, что всё понятно , а значит методология изложения продумана и логична. Женя, спасибо за труды ! Лайк !
оказывается before и after вообще несложные, благодаря объяснениям Жеки все просто и понятно :) как всегда восхищена!
Я рад что понятно)
Как же мне повезло с тем, что я, начинающий верстальщик, наткнулся на ваш канал. Я очень, очень и очень сильно благодарен за ваш труд, который вы предоставляете абсолютно бесплатно! Я просто в шоке. За всю мою жизнь я впервые вижу канал, видео на котором невозможно найти негативный комментарий! А ведь вы не то что просто предоставляете это бесплатно, но и отвечаете на комментарии, оставляете в текстовом блокноте и на своем сайте информацию о уроке. Надеюсь таких людей как вы, будет больше! И еще раз огромное спасибо за все, что вы для нас делаете.
Спасибо за уроки! Огромное человеческое СПАСИБО!
Пожалуйста!
Огромное тебе спасибо за то что ты делишься знаниями накопленными годами и делаешь это без возмездно. Твой канал лучший на RUclips для верстальщика многие платные курсы дают уровень знаний сильно хуже. Недостаточно хорошо знать программирования нужно уметь подавать информацию нужно быть учителем у тебя это прекрасно получается спасибо за твой канал
о качестве уроков говорят дизлайки конкурентов. ну не может же нормальный человек этому видео поставить минус. а если считаете что сделал заслуженно - объяснить же надо за что минус.
Поддерживаю! :)
Радует, что весь код работает во время занятий по видео и после, когда повторяешь заново уже самостоятельно. Подача информации без ошибок, наличие шпаргалок и технического материала играют важную роль в обучении, которая становиться в разы быстрее, чем учиться по книжке.
Ps.домашка удалась, кроме одного: не могу изменить chek.png при наведении мышкой.
Жека, ты красава. С таким преподом и подачей информации у меня есть все шансы добиться успеха. Спасибо за контент.
Пожалуйста!
Очень доходчиво и грамотно поданный материал. Спасибо ОГРОМНОЕ. Патреон само собой))))))))
Спасибо за урок! Как всегда, супер! Интересно было бы посмотреть на Ваше решение домашки и сравнить со своим.
Самый добрый и лучший человек❤
Спасибо за видео уроки, отличная подача материала и очень вариативная.
Пожалуйста!
Женя! Огромное тебе спасибо!!! Действительно, только после твоего видео стало понятно про before и after! Теперь буду частым гостем на твоём канале! СПАСИБО !!!
Я рад!
Ничто не сияет ярче чем твои уроки )) спасибо Женя
Прохожу урок за уроком и каждый раз очень рада что справляюсь.А это благодаря вашей технике подачи материала.Спасибо вам Евгений!!!
Жека, ты лучший! Реально самый крутой курс из тех, что смотрел. Отличная подача материала, никакой лишней болтовни и заумных фраз, все четко и по делу. При этом все сразу становится понятно + тут же домашка для закрепления материала. Спасибо и успехов тебе!
Спасибо! Я рад!
После каждого урока прям ощущаешь плюс к суперсиле своего внутреннего верстальщика ))) Спасибо за тонкости, секреты мастерства и подачу-огонь!
Не могу не написать: Супер! Ни одного лишнего слова, как профессор объясняешь
Огромная благодарность тебе Женя) Псевдо-классы и псевдо-элементы реально детально помогают изменять наполненность сайта
Выпуск огонь!В общем как и всегда!
Спасибо!
Это нечто! С каждым уроком у меня челюсть отвисает все больше). Спасибо!) Просто красавчик!
Спасибо Жека! За псевдо-элементы огромный тебе респект!!!
Спасибо! 🤟👍
Всегда досматриваю до самого конца, чтобы услышать мотивирующую фразу и покачать головой под крутую музыку!
Дядя, дай Бог тебе здоровья!
Спасибо!
Спасибо за крутые уроки, ваш канал бесценная находка на youtube!
Видео обязательно вечером посмотрю. Но хочу напомнить про две более лайтовые темы: правильное обозначение классов и подключение шрифтов к проекту. Было бы интересно посмотреть и понять как это делается, а то в инете куча ненужной инфы идет рядом и суть теряется. А ты всегда по делу говоришь! Так что спасибо за это видео, и ждем следующие по темам!)
Спасибо! Эти темы уже запланированы!
Женя, я в восхищении! Я немного знакома с версткой, но все равно смотрю сейчас уроки с самого начала на случай новой информации. В каждом уроке такое находится, но на ms-clear и moz-focuz я просто запищала от восторга. Не столько даже с них, столько с того, что вам реально не жалко делиться такими вот локальными лайфхаками на этапе, казалось бы, для совсем начинающих. Сразу видно, как вас самого с этого прет и что вы действительно хотите научить полезному, а не плодить дураков, лишь бы платили)). Это супер, это большая редкость.
Спасибо тебе!) Благодаря тебе учеба стала легче и приятней, а за ДЗ отдельное Спасибо)
Пожалуйста!
Я в восторге от уроков,слушать легко и приятно. Переслушал много разных авторов,и платных и бесплатных,здесь работать комфортнее всего. Вам,уважаемый автор желаю побыстрее закатать свой плейлист видеоуроков на какой нибуть UDEMI и заработать много бабосов))
Смотрю с большим интересом)) спасибо!
Спасибо!
Жека красава. Только у него наконец-то понял про before и after. Огромное спасибо. Самый лучший канал.
Спасибо!
Объясняешь максимально понятно)
Спасибо, стараюсь!
Супер -понятно, ничего лишнего, учусь с удовольствием!
Как всегда- на высоте урок! Сорян, не могу поддержать из-за короны....
Спасибо! Нет проблем! Буду рад репостам в соц сети)
Очень интересная тема эти псевдоэлементы!
Вообще крутой курс, даже лучше чем некоторые платные.
Урок бомбезный!)
Спасибо! 🤘
Отличное объяснение псевдоэлеменов "before" и "after"! Очень доступно!
Я просто в восторге! Сейчас получила огромное удовольствие от Вашего урока! Вы самый лучший педагог в моей жизни!!!!! Вы меня вдохновляете учиться каждый день!
spasibo za urok - CSS псевдоэлементы. Псевдоэлементы BEFORE и AFTER. Уроки HTML CSS JS. Урок №11
Спасибо. Огромное спасибо! Каждый урок - восторг, конкретика, понимание и море полезности. Вы фантастичны!!!
Женя, миллион сердечек тебе. Каждый выпуск - восторг!
Спасибо, рад!
пушечка как всегда , спасибо!
Пожалуйста!
Недавно доделал домашку из 9 урока и теперь дополняю ее с учетом новых уроков. Автору огромный респект за труды.
Ну как тут без лайка?
Я бы пачку лайков поставил!
Какой ты добрый, дядь Жень!
Спасибо!
И таки, начало кое-что ПОЛУЧАТЬСЯ! Объясняете Вы потрясающе!!! Очень здорово! А раньше - я даже не смотрела в эту сторону, считая, что программирование для меня "недоступно"... Да это, оказывается так ЗДОРОВО и ИНТЕРЕСНО!!!🌈
«Замечательный браузер:
Интернет Эксплорэр»😁👍
Тож улыбнуло))
Explorer(с англ.)- исследователь
Enternet(с англ.)- Интернет
Исследователь интернета получается!
Снова видео-урок и снова я удивлен... Спасибо Вам, Евгений, за лаконичность и информативность. Раньше я знал только о двух псевдо-элементах - 'before' и 'after'. Теперь узнал о новых и занес их в свою копилку знаний. Очередной заслуженный ЛАЙК за годный урок.
Я рад что полезно!
Как всегда, спасибо большое за урок, чувствуется большая работа над обнуляющим списком, всё понятно про псевдоклассы и псевдоэлементы!
Я так долго искала как вставлять символы типа значок телефона перед номером. Или раскраску пунктов в меню (в CMS нельзя html кодом играться). Можно найти готовый код и вставить. А здесь так четко. Спасибо большое за уроки! У Вас отличная структура подачи знаний!
Пожалуйста!