Ребята, надеюсь выпуск понравился! Появилась возможность поодержать канал: 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 был и у большого фонового изображения) и ни у кого в примерах не нашла, чтобы кто-то пытался это реализовать.
Я наверное под каждым уроком буду писать спасибо, особенно за краткие конспекты!!!! Это просто находка, забыл что-то открыл и посмотрел, не надо видео пересматривать и искать нужное место!
Никогда не получал такого удовольствия от обучения (а за плечами университеты и институты)! А фишка, я думаю, в том, что всё понятно , а значит методология изложения продумана и логична. Женя, спасибо за труды ! Лайк !
Слушая Вас, понимаешь о чём говорите и при этом нет напрягов, а просто отдых. смотрю-понимаю-делаю 3 минуты перерыва, чтобы улеглось в памяти, потом!!! словами не описать какая благодать от Вас нам, желающих учиться
*Огромнейшее тебе спасибо! Благодаря твоим урокам шагаю семимильными шагами к созданию собственного сайта) А твой обнуляющий код - это просто вишенка на этом полезном торте из видеоуроков)*
подсмотрел как добавить списку через ::before галочки которые бэкграунд, оказалось положение и no-repeat после url() у меня были лишними а так все верно, спасибо за подсказку.
Лучший... нет, ну, честно - это лучшие уроки на ютубе, что я находил. Начинал учиться раза 4 и всякий раз словно головой кирпичную стену пытался пробить. В последний раз не мог разобраться с SASS и нашел твоё видео на эту тему. Правда, тогда в очередной раз забросил, но на этот раз решил сразу начать с твоих уроков. Самое лучшее, что ты не просто говоришь, что делать, но и объясняешь, как оно работает. Я наконец-то начал по-настоящему всё понимать. Искренне и от души спасибо!
Жека, ты лучший! Реально самый крутой курс из тех, что смотрел. Отличная подача материала, никакой лишней болтовни и заумных фраз, все четко и по делу. При этом все сразу становится понятно + тут же домашка для закрепления материала. Спасибо и успехов тебе!
Радует, что весь код работает во время занятий по видео и после, когда повторяешь заново уже самостоятельно. Подача информации без ошибок, наличие шпаргалок и технического материала играют важную роль в обучении, которая становиться в разы быстрее, чем учиться по книжке. Ps.домашка удалась, кроме одного: не могу изменить chek.png при наведении мышкой.
Женя! Огромное тебе спасибо!!! Действительно, только после твоего видео стало понятно про before и after! Теперь буду частым гостем на твоём канале! СПАСИБО !!!
Снова видео-урок и снова я удивлен... Спасибо Вам, Евгений, за лаконичность и информативность. Раньше я знал только о двух псевдо-элементах - 'before' и 'after'. Теперь узнал о новых и занес их в свою копилку знаний. Очередной заслуженный ЛАЙК за годный урок.
о качестве уроков говорят дизлайки конкурентов. ну не может же нормальный человек этому видео поставить минус. а если считаете что сделал заслуженно - объяснить же надо за что минус.
Женя, я в восхищении! Я немного знакома с версткой, но все равно смотрю сейчас уроки с самого начала на случай новой информации. В каждом уроке такое находится, но на ms-clear и moz-focuz я просто запищала от восторга. Не столько даже с них, столько с того, что вам реально не жалко делиться такими вот локальными лайфхаками на этапе, казалось бы, для совсем начинающих. Сразу видно, как вас самого с этого прет и что вы действительно хотите научить полезному, а не плодить дураков, лишь бы платили)). Это супер, это большая редкость.
Я в восторге от уроков,слушать легко и приятно. Переслушал много разных авторов,и платных и бесплатных,здесь работать комфортнее всего. Вам,уважаемый автор желаю побыстрее закатать свой плейлист видеоуроков на какой нибуть UDEMI и заработать много бабосов))
Видео обязательно вечером посмотрю. Но хочу напомнить про две более лайтовые темы: правильное обозначение классов и подключение шрифтов к проекту. Было бы интересно посмотреть и понять как это делается, а то в инете куча ненужной инфы идет рядом и суть теряется. А ты всегда по делу говоришь! Так что спасибо за это видео, и ждем следующие по темам!)
Огромное тебе спасибо за то что ты делишься знаниями накопленными годами и делаешь это без возмездно. Твой канал лучший на RUclips для верстальщика многие платные курсы дают уровень знаний сильно хуже. Недостаточно хорошо знать программирования нужно уметь подавать информацию нужно быть учителем у тебя это прекрасно получается спасибо за твой канал
Видос супер по кайфу! Жека респект! Есть разбор домашки? Интересно как в кнопке (Full story) добавить стрелку с помощью after, а именно, как ее опустить на пару пикселей?
Ух ты! Я читаю книгу и в ней говорится про эти псевдоклассы и псевдоэлементы, но благодаря тебе, я вижу как они работают. Огромное тебе спасибо Евгений)
Впервые вижу обнуляющий список: "Что за мать его абракадабра" С каждым последующим уроком: "Ого, какая же всё таки нереально крутая штука!" Уроки огонь, безмерная благодарность!
Ребята, надеюсь выпуск понравился!
Появилась возможность поодержать канал:
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, спасибо, Жека!
Спасибо!
Не говори , столько искал подробной инфы на счёт бефор и афтер
Твой канал просто находка для начинающего верстальщика🙂!Хочу поблагодарить за
труд, который ты делаешь!!
Спасибо большое!
Привет, можешь сказать, как сейчас у тебя обстоят дела с веб-разработкой? Было бы интересно узнать
@@95fsk32А у тебя как?
Мне просто интересно
Привет. По поводу галочки, вот что получилось у меня.
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!
Величезне!!! Велиииичееееезнееее дякуюююю тобі за обнулюючий список!
Насправді, це величезний подарунок!
Боже ты такой классный, ты даёшь информацию интересно, просто и запоминающе!
Спасибо!
Окрема подяка за обнулення! Це реальна крута фішка!
Передивила багато контенту, аби зрозуміти для чого ж потрібні псевдоелементи. Лише Женя зміг пояснити все зрозумілою мовою, і тепер я можу рухатися далі. Дякую) Це дійсно крутяк)
Дякую! Це надихає!
Дякую за твої уроки, вони всі корисні, а головне зрозумілі та зроблені з душею.
Жень, спасибо тебе огромное. Ты мне как отец, в любом случае выручишь.
Спасибо!
Эвгене, якби всі мої викладачі в універі так давали інформацію свого часу, я би вже давно працювала за спеціальністю! Дуже корисно і позитивно! Велике дякую!!!!!!!!!!!!!!!!!!!!!!!!!!
Будь ласка
Ты просто красава) столько сил вложил в канал, сейчас изучаю все это и понимаю что для бесплатного курса это просто шикарно, благодарю тебя.
Результат бар ма?
Я тоже изучаю сейчас
Евгений, благодарю Вас за такую бескорыстную подачу материала , очень объемно и исчерпывающе , мне 37 и я без труда все понимаю, но вы дали более короткую дорогу в Iti сферу которую я откладывал всю жизнь .В этот праздник желаю Вам благополучия и процветания, я каждый день учусь с Вами и благодарен тому что вы есть на просторах интернета.
Нарадоваться не могу, что когда-то наткнулся на этот канал. Спасибо, Жека, за труды твои) отличная подача материала) Всех благ.
Дуже дякую за вашу працю і за хорошу подачу матеріалу. Люблю дивитися ваші відео. Сподіваюся стати схожим на вас. Дякую, що ділитеся своїм досвідом з людьми.ВЕЛИКЕ СПАСИБІ!!!
Впервые смотрю такие полезные видосы про HTML и CSS с таким классным объяснением!!!
Спасибо! Я рад что полезно!
Наверное единственный автор, который так доступно и приятно объясняет, что понятно ,даже когда кушаю во время просмотра) Спасибо большое! очень жду занятия по 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 был и у большого фонового изображения) и ни у кого в примерах не нашла, чтобы кто-то пытался это реализовать.
Как всегда всё только по теме, ничего лишнего! Спасибо!
Спасибо, старался)
Я наверное под каждым уроком буду писать спасибо, особенно за краткие конспекты!!!! Это просто находка, забыл что-то открыл и посмотрел, не надо видео пересматривать и искать нужное место!
Спасибо Женя! За 14 минут доступно объяснил эту тему, которая мне за несколько часов самостоятельного штудирования не зашла.
Супер! Я рад!
Никогда не получал такого удовольствия от обучения (а за плечами университеты и институты)! А фишка, я думаю, в том, что всё понятно , а значит методология изложения продумана и логична. Женя, спасибо за труды ! Лайк !
Жека, ты красава. С таким преподом и подачей информации у меня есть все шансы добиться успеха. Спасибо за контент.
Пожалуйста!
Слушая Вас, понимаешь о чём говорите и при этом нет напрягов, а просто отдых. смотрю-понимаю-делаю 3 минуты перерыва, чтобы улеглось в памяти, потом!!! словами не описать
какая благодать от Вас нам, желающих учиться
*Огромнейшее тебе спасибо! Благодаря твоим урокам шагаю семимильными шагами к созданию собственного сайта) А твой обнуляющий код - это просто вишенка на этом полезном торте из видеоуроков)*
Этот курс будут смотреть еще наши дети, так что спасибо за твой большой труд❤
У меня была проблема как через псевдоелемент 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. Хтось знає як це зробити?
Хочу і я приєднатися до подяки Жені за його круті відео контент , людина вкладає свій час і єнергію в освіту. Ділится всім своїм досвідом )))
Учу html и css, тут хорошо объясняют да ещё и домашка есть) спасибо что стараешься;)
Пожалуйста!
Дякую за класні пояснення!!! Супер!
Я рад!
Спасибо за урок! Отлично, ка всегда! «Кавыкчкчки» alt+0171 alt+0187 на num-паде (alt надо держать).
Обнуляющий стиль бесценен, как и весь контент от Евгения!!!!
оказывается before и after вообще несложные, благодаря объяснениям Жеки все просто и понятно :) как всегда восхищена!
Я рад что понятно)
Лучший... нет, ну, честно - это лучшие уроки на ютубе, что я находил. Начинал учиться раза 4 и всякий раз словно головой кирпичную стену пытался пробить. В последний раз не мог разобраться с SASS и нашел твоё видео на эту тему. Правда, тогда в очередной раз забросил, но на этот раз решил сразу начать с твоих уроков. Самое лучшее, что ты не просто говоришь, что делать, но и объясняешь, как оно работает. Я наконец-то начал по-настоящему всё понимать. Искренне и от души спасибо!
Жека, ты лучший! Реально самый крутой курс из тех, что смотрел. Отличная подача материала, никакой лишней болтовни и заумных фраз, все четко и по делу. При этом все сразу становится понятно + тут же домашка для закрепления материала. Спасибо и успехов тебе!
Спасибо! Я рад!
Доходчиво человек объяснил про данные псевдоэлементы. Очень полезное видео. Спасибо.
Пожалуйста!
Ничто не сияет ярче чем твои уроки )) спасибо Женя
Радует, что весь код работает во время занятий по видео и после, когда повторяешь заново уже самостоятельно. Подача информации без ошибок, наличие шпаргалок и технического материала играют важную роль в обучении, которая становиться в разы быстрее, чем учиться по книжке.
Ps.домашка удалась, кроме одного: не могу изменить chek.png при наведении мышкой.
Спасибо за урок! Как всегда, супер! Интересно было бы посмотреть на Ваше решение домашки и сравнить со своим.
Женя! Огромное тебе спасибо!!! Действительно, только после твоего видео стало понятно про before и after! Теперь буду частым гостем на твоём канале! СПАСИБО !!!
Я рад!
Спасибо за уроки! Огромное человеческое СПАСИБО!
Пожалуйста!
Дякую за урок. Вчимося далі.
Женя, очень вас благодарю за прекрасные и понятные уроки
Снова видео-урок и снова я удивлен... Спасибо Вам, Евгений, за лаконичность и информативность. Раньше я знал только о двух псевдо-элементах - 'before' и 'after'. Теперь узнал о новых и занес их в свою копилку знаний. Очередной заслуженный ЛАЙК за годный урок.
Я рад что полезно!
Спасибо за видео уроки, отличная подача материала и очень вариативная.
Пожалуйста!
После каждого урока прям ощущаешь плюс к суперсиле своего внутреннего верстальщика ))) Спасибо за тонкости, секреты мастерства и подачу-огонь!
о качестве уроков говорят дизлайки конкурентов. ну не может же нормальный человек этому видео поставить минус. а если считаете что сделал заслуженно - объяснить же надо за что минус.
Поддерживаю! :)
Женя, я в восхищении! Я немного знакома с версткой, но все равно смотрю сейчас уроки с самого начала на случай новой информации. В каждом уроке такое находится, но на ms-clear и moz-focuz я просто запищала от восторга. Не столько даже с них, столько с того, что вам реально не жалко делиться такими вот локальными лайфхаками на этапе, казалось бы, для совсем начинающих. Сразу видно, как вас самого с этого прет и что вы действительно хотите научить полезному, а не плодить дураков, лишь бы платили)). Это супер, это большая редкость.
:hover: before впечатлило, спасибо за урок и Ваши советы.
Пожалуйста!
Я в восторге от уроков,слушать легко и приятно. Переслушал много разных авторов,и платных и бесплатных,здесь работать комфортнее всего. Вам,уважаемый автор желаю побыстрее закатать свой плейлист видеоуроков на какой нибуть UDEMI и заработать много бабосов))
Выпуск огонь!В общем как и всегда!
Спасибо!
Женя, миллион сердечек тебе. Каждый выпуск - восторг!
Спасибо, рад!
Спасибо Жека! За псевдо-элементы огромный тебе респект!!!
Спасибо! 🤟👍
Жека красава. Только у него наконец-то понял про before и after. Огромное спасибо. Самый лучший канал.
Спасибо!
Видео обязательно вечером посмотрю. Но хочу напомнить про две более лайтовые темы: правильное обозначение классов и подключение шрифтов к проекту. Было бы интересно посмотреть и понять как это делается, а то в инете куча ненужной инфы идет рядом и суть теряется. А ты всегда по делу говоришь! Так что спасибо за это видео, и ждем следующие по темам!)
Спасибо! Эти темы уже запланированы!
Женя, спасибо огромное в сотый раз! Добра тебе и твоему дому, обнял!
Не могу не написать: Супер! Ни одного лишнего слова, как профессор объясняешь
Огромное тебе спасибо за то что ты делишься знаниями накопленными годами и делаешь это без возмездно. Твой канал лучший на RUclips для верстальщика многие платные курсы дают уровень знаний сильно хуже. Недостаточно хорошо знать программирования нужно уметь подавать информацию нужно быть учителем у тебя это прекрасно получается спасибо за твой канал
Бро нехай прибуде з тобою сила )))дякую за урок
Будь ласка
Очень полезно даже для программиста с большим стажем!
Просто быстро и понятно!
Благодарю!
Спасибо тебе!) Благодаря тебе учеба стала легче и приятней, а за ДЗ отдельное Спасибо)
Пожалуйста!
Прохожу урок за уроком и каждый раз очень рада что справляюсь.А это благодаря вашей технике подачи материала.Спасибо вам Евгений!!!
Это нечто! С каждым уроком у меня челюсть отвисает все больше). Спасибо!) Просто красавчик!
Как всегда- на высоте урок! Сорян, не могу поддержать из-за короны....
Спасибо! Нет проблем! Буду рад репостам в соц сети)
Всегда досматриваю до самого конца, чтобы услышать мотивирующую фразу и покачать головой под крутую музыку!
Дядя, дай Бог тебе здоровья!
Спасибо!
Недавно доделал домашку из 9 урока и теперь дополняю ее с учетом новых уроков. Автору огромный респект за труды.
Ну как тут без лайка?
Я бы пачку лайков поставил!
Какой ты добрый, дядь Жень!
Спасибо!
Я никогда не пишу комментарии и редко ставлю лайки, но в этом курсе под каждым видео стоит мой лайк. Жека - красавчик, так держать!
Смотрю с большим интересом)) спасибо!
Спасибо!
Женя, дуже ДЯКУЮ!!! Урок дуже корисний!👍👍👍👍👍👍👍
Урок бомбезный!)
Спасибо! 🤘
Огромная благодарность тебе Женя) Псевдо-классы и псевдо-элементы реально детально помогают изменять наполненность сайта
Видос супер по кайфу! Жека респект! Есть разбор домашки? Интересно как в кнопке (Full story) добавить стрелку с помощью after, а именно, как ее опустить на пару пикселей?
Не смогу уснуть пока не опущу)
Нашлось решение как опустить?
@@АртёмСеров-г1ч position: absolute и margin-top 3px :)
@@olegryazanov5926 это в дальнейших уроках будет?
@@АртёмСеров-г1ч не знаю, сам только до этого дошёл. Просто загуглил)
Очень доходчиво и грамотно поданный материал. Спасибо ОГРОМНОЕ. Патреон само собой))))))))
Спасибо. Огромное спасибо! Каждый урок - восторг, конкретика, понимание и море полезности. Вы фантастичны!!!
Ух ты!
Я читаю книгу и в ней говорится про эти псевдоклассы и псевдоэлементы, но благодаря тебе, я вижу как они работают. Огромное тебе спасибо Евгений)
Пожалуйста!
Объясняешь максимально понятно)
Спасибо, стараюсь!
Впервые вижу обнуляющий список:
"Что за мать его абракадабра"
С каждым последующим уроком:
"Ого, какая же всё таки нереально крутая штука!"
Уроки огонь, безмерная благодарность!
«Замечательный браузер:
Интернет Эксплорэр»😁👍
Тож улыбнуло))
Explorer(с англ.)- исследователь
Enternet(с англ.)- Интернет
Исследователь интернета получается!
Женя, больше спасибо за то, что ты делаешь! Я даже отказался от курсов, потому что у тебя все гораздо круче структурировано.