CSS Стили шрифта и текста. CSS font-size. CSS color, CSS text-shadow. Уроки HTML CSS JS. Урок №6
HTML-код
- Опубликовано: 16 июл 2019
- CSS Стили шрифта и текста. CSS font-size. CSS color, CSS text-shadow. Уроки HTML CSS JS. Урок №6. Продолжаем учить CSS с нуля, сегодня познакомимся с параметрами для работы с текстом и шрифтами. Стилизация текста - это одно из основных предназначений таблиц стилей. Поэтому важно хорошо владеть соответствующими CSS свойствами и их значениями, которые мы сейчас и изучим! А в конце урока сделаем практическое задание по макету PSD. Но перед тем как начать, я бы хотел ответить на пару ваших вопросов касательно обнуляющих стилей из предыдущего урока.
Изучим CSS свойства: font-family, font-size, font-style, font-weight, color, text-align, text-decoration, text-shadow, text-transform, text-indent, letter-spacing, line-height, white-space и их значения.
🔴 Весь плейлист с уроками по HTML CSS JS верстке:
• БЕСПЛАТНЫЙ курс по вер...
Архив с файлами урока ищи в телеграм канале t.me/freelancer_lifestyle
Или качай по ссылке: fls.guru/files/tutorials/css_...
🔴 Получить доступ к плюшкам + поддержать канал: / freelancerlifestyle
🔴 Telegram канал: t.me/freelancer_lifestyle (teleg.run/freelancer_lifestyle)
🔴 Telegram чат по верстке: t.me/flschat (teleg.run/flschat)
🔴 Facebook: / freelancerlifestyle
🔴 Instagram: / freelancer.lifestyle
👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками!
Ссылка на канал: / freelancerlifestyle
🤟 Живи, а работай в свободное время! ©
#фрилансерпожизни #обучение #верстка
![Kodak Black - Dis Time [Official Music Video]](http://i.ytimg.com/vi/V3g4JDQkE9U/mqdefault.jpg)
Новый чат для общения, обсуждения выпусков и помощи друг другу - t.me/flschat
Жека, у меня вопрос. Почему ты ставишь в слэш? при нажатии на таб он не ставится по умолчанию.
@@Valerka10 В тэге "br" , есть открывающий тэг, но закрывающего нет. По этому правильно будет ставить со слэш.
@@jelefor1229 И в чем смысл ставить этот закрывающий элемент если сути дела не меняет?
Поставил лайки везде где только мог!
@@spondiasshow8319 красавчик, так держать
Неужели еще остались люди, которые дают годную инфу, без воды, бесплатно, не продавая ничего в конце каждого видео.. уважуха!
Есть) Спасибо!
@@FreelancerLifeStyle Вас спасибо!
@@FreelancerLifeStyle Точно, это только вам спасибо)
не забудь отблагодарить человека;)
предлагаю вместе со мной отблагодарить за труд , каждый по своим возможностям .
3:19 font-family (устанавливает семейство шрифта)
6:27 font-size (определяет размер шрифта)
7:40 font-style (определяет начертание шрифта)
8:51 font-weight (устанавливает насыщенность шрифта)
10:07 color (определяет цвет текста)
11:13 text-align (определяет горизонтальное выравнивание текста)
13:36 text-decoration (добавляет оформление текста)
14:51 text-shadow (добавляет тень к тексту)
16:30 text-transform (заглавные или прописные символы)
17:50 text-indent (отступ от левого края)
18:39 letter-spacing (определяет интервал между символами)
19:31 word-spacing (определяет интервал между словами)
20:08 white-space (управляет свойствами пробелов между словами)
21:24 line-height (устанавливает межстрочный интервал текста)
p.s. Всем удачи в начинаниях
Моё почтение
@Команда RUclips затем. Простой вопрос, анальный ответ
@Команда RUclips мне бы было даже стремно такой ответ писать, чел... Пиздец ты шутник стрелочник, даже шутить над тобой жалко)
@Команда RUclips ниче что есть люди которым нужнен один код, а пролистыввть весь видос не очень найс занятие, понимаешь?
Спасибо!
Чувак, ты лучший. Никакой лишней шелухи, чистая инфа по верстке. Лайк, подписочка)
Спасибо! Стараюсь!
Боже,что это за человек и почему он так крут?
Спасибо, стараюсь
Хорошо, что в мире есть такие энтузиасты :)) еще и бесплатно, еще все так качественно смонтировано))
Спасибо!
@@FreelancerLifeStyle Это Вам огромное СПАСИБО за такой труд и бесплатно❤👍
Чувак, я за послідні місяці перелопатив таку гору інфи на ютубі, що з 100% впевненістю можу заявити - до такої шикарної подачі матеріалу, як в тебе, ніхто навіть близько не дотягує. Настільки все доступно, структуровано і логічно послідовно. Ти робиш велику справу. Натхнення тобі і терпіння в її продовженні. Впевнений, що лям підписників не за такими далекими горами, як виглядає на перший погляд.
Дякую! Радий що корисно!
Перевёл твой текст на русский язык, достоен лайка. Переклав твій текст російською мовою, гідний лайка. Кстати вот этот текст я перевёл с русского на украинский))) До речі ось цей текст я переклав з російської на українську)))
Спасибо большое!!!2023 год обучение актуально как никогда:) очень просто и понятно объясняете :)
как успехи?
что используешь вместо авокода?
Очень круто , что вы в каждом ролике напоминаете что-то из предыдущих (по типу как быстро скопировать все классы для CSS, как быстро в html сделать запись класса и не тратить на это много времени, что H1 возможен только один раз на 1 страницу и т.д.). Это рили помогает быстрее усваивать пройденный материал, если с первого раза не запомнишь, то со второго так точно)
Именно! Спасибо! 👍👍
что нужно нажать на мак ос для копирования классов?? :( пробовал command +тильда (кнопка ниже esc,mac) не сработало, приложение sublime настраивал как на первом уроке в этом плейлисте.спасибо, и НЕТ ВОЙНЕ
@@user-mi4kj4gr7t пересмотри внимательно видео по настройке плагина Тэг.Там нужно зайти в Preferences, далее в Key Bindings, затем ручками прописать команду с указанием горячих клавиш.Я имел такую проблему и успешно решил этим путем.
@@user-us1ym1jj2s а что за видео? по поиску нашел только мета тэги, но он по плейлисту дальше идет
Велетенське спасибі за Ваш курс і те, що ви робите! Я надзвичайно Вам вдячна, що під час війни маю можливість здобувати нові знання і опановувати нову професію. Це дуже корисно!!!!
Да круто все, никто не даст за бесплатно столько всего.
Я рад!
Никто ,кроме Жеки))))
Очень доходчиво и все по делу! С каждым уроком все интереснее! Евгений, спасибо!
Всем привет, я тут из марта 2021 года и и обычно я никогда не пишу комментарии но тут никак не смогу пройти мимо так как реально очень уж понятные уроки, спасибо за нее огромное. Надеюсь пройти весь курс до конца.
Спасибо!
Это правда. Он реально старается!!! Не каждый будет так выкладываться.
Ну что, прошли весь курс?
@@shinobiyt9506 видимо нет
@@front_praxis аахаххахахахахха
очень смешно прозвучало
а с чего такое мнение то?
Женя, большое спасибо! Учиться с Вами максимально интересно. )
На мой взгляд на просторах RUclips это самые лучшие обучающие видео-уроки по веб-разработке!!!
Я тоже начал
Хочеш скин свой телеграм может бить работаем вместе. Создаем проэкти в обшем будем улучшат свою верстку
Ещё один отличный урок завершён! Спасибо!
Огромное спасибо за качественную и структурированную информацию. Вас приятно смотреть.
Круто что параллельно изучению теории еще и раскрывается возможность инструментов типа редактора и горячие клавиши.
Какой же ты замечательный человек!!! Спасибо тебе огромное Евгений! Самое лучшее обучение вообще в жизни с которым я сталкивался!!!
Спасибо за такие понятные хорошие курсы по вёрстке вы большой молодец!
Отличная подача материала, все понятно и легко усваивается! Спасибо за ваш труд!
Спасибо Жека! Нашёл себя в этой специальности, время пролетает незаметно пока смотрю твои уроки и выполняю домашку, эксперементирую сам уже с тем, что ты дал нам.
Жалко что нельзя два лайка поставить, или больше!) спасибо!
Но можно сделать репост! Спасибо!
Подача материала СУПЕРРРР!!!Спасибо вам Евгений за ваши труды!
Тебя просто хочется обнять по человечески! Спасибо тебе большое за твой труд!
Жека, ты лучший! спасибо, за очень доступное объяснение материала. Только начал учиться, но не намерен сдаваться!!!
Евгений, спасибо вам большое. Всё как на платных курсах и даже лучше. Классная подача, замечательный звук, приятная речь, краткие и понятные объяснения, наличие домашнего задание. И всё это бесплатно. Спасибо огромное. Я думаю, вы даете возможность многим людям начать изучать вёрстку. Однозначно подписка и лайк)
Как же ты меня мотивируешь! Лучшая подача материала! Надеюсь ты обучаешься, развиваешься и живешь, ну а работаешь в свободное время!!!
Спасибо огромное вам за ваши видео! Ничего лучше не встречал)Отличная позитивная подача
Женя, с каждым твоим уроком во мне растет уверенность, что у меня все получится. И да, я совсем новичок. Благодаря твоим урокам сложное становится простым и понятным. А домашки учат самостоятельной работе. Спасибо большое!
Жду, когда мой комментарий попадет в видео. Жека, ты лучший!
Ок, договорились)
Спасибо, за крутые видео, за четкое донесение информации, круто!
Все понятно, а позитивный настрой дает огромное желание идти дальше!
Евгений как всегда на высоте!!! Просьба одна - не меняй формат и стиль подачи материала. Все очень доходчиво и понятно! Лучший из лучших жирный лайк как и всегда!!!
Спасибо большое! Уточни, в этом видео норм подача кода и остального?
@@FreelancerLifeStyle да.прекрасно видно код а также особенно порадовал файл txt и файлик для верстки в общем все суперски учиться с таким наставником одно удовольствие. Также спасибо за оперативную поддержку в чатике в телеге)))желаю успехов в жизни и творчестве!!!
@@aleksgbr3878, спасибо большое!
Великолепный ПРЕПОДАВАТЕЛЬ !! - большое спасибо, Евгений, за Ваш общественно полезный труд !! ... Ваше существование на нашей планете - большая удача для Ваших современников :)
Огромная благодарность за такие качественное уроки и возможность их проходить и изучать несмотря ни на что! 🙏
Выпуски просто супер! Спасибо огромное!
«Спасибо» я тоже хочу стать как ты помогать людям учиться, ты мой новый герой )))
Женя, огромное спасибо за Ваши уроки! Благодаря такой подаче материала действительно сложное становится простым и понятным, а главное интересным. Я и раньше смотрел ролики других авторов, но здесь я начал все понимать. Сделал домашку по этому уроку и это уже не показалось мне слишком сложным. Обязательно буду продолжать и надеюсь освоить верстку в свои 58 лет. Ваши ролики мотивируют, тем более что пенсию, наверное, совсем отменят в скором времени. Еще раз спасибо!
Спасибо Евгений! контент структурирован, доступно и качественно разложен, для новичка и опытного юзера есть полезная информация, отдельное спасибо за фитчи и лайфхаки - это 100% лайк, Вам успехов! Спасибо!
спасибо за урок, особенное спасибо за текстовый файл со всеми свойствами, сэкономили кучу времени
Это лучший канал. Заниматься одно удовольствие. С такой подачей материала жду не дождусь нового дня, что бы изучать все новые возможности.
Я рад!
Очень круто ! Подача информации на высоте ! Отлично подойдёт для понимания всех деталей вёрстки! Спасибо!
Супер! Я рад!
Спасибо за труды! Я замотивировался учиться заново!
Лучший канал по программированию на RUclips.Спасибо вам за суперские видео!
Ты просто делаешь офигенный контент! Вот реально хочется тебе руку пожать ! Спасибо за всё! Не забрасывай это дело, пожалуйста, у тебя всё очень круто !
Спасибо большое!
Женя, спасибо за бесценную информацию!!! Прошла 6 урок!!! Пока не легко, но решила пройти всё и научиться верстать !!!!
как сейчас дела идут?
Женя, спасибо за такие видосы! Я только в начале пути, и благодаря твоим видосам уже многое знаю!
Дай вам Бог здоровья и счастья. Вы лучший!
Блин, спасибо. Ты создаёшь не просто супер контент, но и новых конкурентов в сфере веб разработки.
Работы всем хватит!
Жека, огромное спасибо тебе за твою работу !!!!! Я реально начал понимать и не забросил освоение может быть новой професии ! Много видео есть про верстку, но как преподаеш ты, никого ! Спасибо !!!
Я рад что полезно!
Самая лучшая подача материала, которую я видела. Огромное спасибо! Вы задаете высокие стандарты обучения, а это дорогого стоит, особенно учитывая, что это бесплатно! Желаю процветания и всех благ!!!
Возвращаюсь к тебе уже 3 раз, надеюсь в этот раз дойду до конца. Ты реально лучший, все четко, ясно и по делу.
От души за такое подробное видео🙏🏻🤝
Рад что полезно!
Очень классно.! Манера подачи материала отличная!!
Спасибо, стараюсь)
Урок 6- Done ✔ Спасибо, Женя 🔥🔥🔥🔥💗💗💗
Очень круто объясняете))) взахлёб смотрю, все понимаю.
Круто что в конце показываете на практике все
Супер! Подробно и структурировано, да ещё и блокнот с подсказками есть👍но мини конспект всё равно веду в ворде.
Спасибо!
Я из республики Молдова. Очень вам благодарна !!! Это удивительно что учусь программированию, просто смотря ваши видео уроки, за БЕСПЛАТНО !!! Буду рекомендовать вас каждому кто хочет обучатся программированию!!! Вы удивительно ясно все объясняйте !!! ТОП !!!
Продолжаем обучаться! Лучший курс на Ютубе! Жека спасибо тебе!
Обожаю вашу концовку, это моя мотивация 🤩 живи. работай в свободное время
Каждый урок просто суперский! Спасибо 😁
Пожалуйста!
Уроки от профессионала, бесплатно, открыто, очень качественно, денег не просят! Спасибо огромное! Великолепная подача материала. Низкий поклон, уважуха, лайк, подписка. Прям еще раз спасибо! Желаю миллион подписчиков!
Спасибо! Рад что полезно!
Шикарный урок! Залипаю весь день. Правда , очень удобно когда CSS и HTML окна одновременно показаны на экране
Класс оригинально устроены уроки
Красава! Очень понятно объясняешь, продолжай в том же духе! Спасибо за уроки!
Пожалуйста!
Топ, что увеличил, теперь удобнее. Спасибо)
Пожалуйста!
Все было нормально видно с самого начала уроков, смотрел как с телефона, так и с ноута. Но главная приятность в том - что вы прислушиваетесь к просьбам людей. Спасибо, дай вам Бог здоровья.
Спасибо за уроки, спасибо за шпаргалки и самое важное спасибо за желание давать свои знания другим, это дорогого стоит, как только сверстаю свой первый сайт по твоим урокам сразу же отблагодарю. Благие деяния требуют поощрения!)
Благодарю за уроки! Легко воспринимается инфа, ты один из редких преподавателей у кого хочется учиться)))) . Крупный шрифт лучше видно.
Блин теперь я начинаю понимать что всё это очень легко учить особенно когда хороший учитель 🙏 спасибо тебе и пожалуйста сделай видео типо рубрика один день из жизни фрилансера все будут рады посмотреть как ты проводишь свой день 🤗
Спасибо, сделаю
Спасибо тебе за тебя! Я наконец-то стала интересоваться версткой и не пытаюсь заставлять себя учиться, потому что ты отлично подносишь материал, даже объясняешь как работать с Авокодом! Ты учишь лайфхакам верстки, сокращениям. Это очень помогает )
Супер! Я очень рад!
Евгений Вас приятно смотреть, вы талант и действительно качественный преподаватель. я благодарю Вас за предоставленный материал.
Большое вам человеческое спасибо. Сам подумал заняться web програмированнием и тут нашёл ваш канал. Это прям судьба и самое главное у вас еасть сразу практика по текущему уроку за это прям от всего сердца спасибо
По-моему самый годный, понятный материал по CSS.
Спасибо!
Всё также чётко и узнал пару полезных плюшек)
Отлично!
Спасибо тебе огромное за твои уроки, они очень информативные и легко усваиваются :D
Подписка, лайк, комментарий! Евгений, снимайте ещё и ещё и ещё. Спасибо Вам, за Ваш труд.
Харизматичная и толковая подача, последовательное изложение материала, а главное - появилась вера в то, что я смогу это дело одолеть ! Однозначно лайк!
как успехи?
Жека,Ваша аура настолько положительная,что материал сам просится осесть в голове)))Спасибо огромное за труд и заботливое отношение,про команду с тильдой отдельная благодарность!!!
Пожалуйста!
Это очень интересно, в каждом уроке есть необходимая информация
Спасибо за уроки! Приятно слушать! Хотелось бы конечно же что бы уделили побольше внимание именно начальным настройкам шрифтов,размеров и тд.
Алмаз русскоязычного веб ютуба!) Спасибо огромное!
Спасибо! Рад что полезно!
Ждем также видео по рубрике инструменты)))
Скоро будет)
В очередной раз хочу поблагодарить за годную подачу информации, просто красавчик. Таких людей конечно малo RESPECT!
Спасибо за урок. Учимся дальше!
Просто разрывной урок!!!!!!
будеш моим партнером по изучению верстки. Скин телеграм. Будем создат проэкти
Очень хорошие уроки)) как бы все еще запомнить )) практиковаться наверное побольше )
Верно, нужна практика
Спасибо за уроки!
Спасибо за урок! Очень крутой!
Уроки просто великолепны. Подача материала замечательная. Я вот только изменил в этом уроке текстовое содержание тегов. Вместо текста рыбы я вставил параметры css из таблицы стилей. Иногда для объема, если это надо, дополнил текстом рыбой. Теперь получилось, что когда я открываю html документ в браузере я вижу результаты работы стилей и тут-же вижу какими параметрами достигался тот или иной результат. Мне не нужно для этого открывать vs code. Все очень наглядно. Надеюсь, что вам пригодится мой коммент.
увидел у хауди подписался и не зря)
Спасибо!
Слушай, друг. Мне у Хауди не особо понравилось. Там, по-моему, вообще ничего полезного, кроме тегов основных, ничего и нет. Тут гораздо понятней)) Но это только моё мнение
@Пиджи :3 я бы так не сказал, он делает много видео по темам, в которых сам не разбирается. Урок по django просто полный треш.
@Пиджи :3 прости, что поздно ответил. Слушай, наверное. Я просто с этой стороны на это не смотрел.
Хауди гонется за количеством видео, делает контент на коленке... да и знать "всего" не возможно... Евгений же каждый урок продумывает до мелочей, возможно, даже сам выясняет что-то перед тем как нам обьяснить, подход - профессиональный, поэтому все кто смотрят, отмечают качество и содержательность... ну и конечно позитивность))
Вот прям огромное спасибо за то, что прислушиваешься к просьбам!!
Так гараздо удобнее!
Ты ващэ супер))
Просто красавчик! Инфа укладывается в голове так, как носочки в тумбочке перфекциониста)) Все четко, по-порядку, без спешки. Спасибо тебе огромное!!!
Какие же шикарные уроки! Ты явно делаешь мир лучше! А с помощью твоих новых видео я еще и свой украинский подтягиваю)
бля почему этот канал не в ТОПе рядом с ХаудиХо самые конкретный и хорошие видео Спасибо))
Спасибо, все будет!
Я в восхищении! Спасибо за ваш труд! Всё очень понятно и доходчиво! Влюбляете в программирование! Формат - шикарен! Информация, свет, звук, музыка - идеально!!!
Отличный и очень полезный ролик, с качественным монтажом. Спасибо ! Благодаря тебе я узнаю очень много о создании сайтов =D
Присоединяюсь к хвалебным одам в комментариях. Подача, объяснение, юмор - все на высоте! Придется оформить подписку на патреоне. Спасибо большое!
Спасибо!
божественно
Спасибо!
Ты как глоток свежего воздуха для начинающего верстальщика) не останавливайся делать видео)