KZhead

Изучение CSS для новичков / Урок #7 - Стили для блоков

Школа itProger / Программирование
2024 ж. 22 Мам.
90 593 Рет қаралды
Жүктеу

Любой сайт состоит из блоков. Каждый блок может быть выделен тегом div или же каким-либо специальным тегом по типу: header, footer, aside, main и так далее. За урок мы научимся прописывать стили к подобным блокам.
✅ Полезные ссылки:
🔫 Курс на сайте itProger: itproger.com/course/css/7
⏰ Тайм коды:
00:00 - Начало
00:17 - Создание блока
00:42 - Добавление стилей к блоку
02:28 - Добавление обводки: «border»
06:38 - Округление углов
08:50 - Прозрачность объекта
09:41 - Внешние и внутренние отступы
15:08 - Строчный элемент в формате блока
18:35 - Заключительная часть
✔ Сообщество программистов: itproger.com/
✔ -------------
Вступай в группу Вк - vk.com/prog_life 🚀
Группа FaceBook - goo.gl/XW0aaP
Инстаграм itProger: / itproger_official
Instagram: / gosha_dudar
Telegram: t.me/itProger_official
Twitter - / goshadudar
- Уроки от #itProger 👨🏼‍💻
- Все уроки по хештегу #itprogerLessons

Пікірлер

  • спасибо тебе большое я целый день мучился с отступами а тут так все просто (margin) для тебя отдельное место в раю)

    @zaminr3400@zaminr34003 жыл бұрын

  • Пожалуйста!!! Выпускай урок чаще,посмотрел все уроки хтмл подряд, а тут ждать))))))))))

    @user-rq4pp4ss3k@user-rq4pp4ss3k3 жыл бұрын

  • Посмотрел старые уроки по CSS теперь новые! Подача гораздо интересней и как то структурировано всё. Спасибо!

    @main_idler@main_idler3 жыл бұрын

    • Солидарен,интереснее на много

      @diasoralbekov6465@diasoralbekov64653 жыл бұрын

    • pro tip : you can watch series on Kaldrostream. Been using them for watching lots of of movies these days.

      @samuelimran3429@samuelimran34293 жыл бұрын

    • @@main_idler LOndon is capital of the Great Britain.....

      @migelonio292@migelonio2922 жыл бұрын

  • Все ближе к программированию

    @user-mq9kt7pb2l@user-mq9kt7pb2l3 жыл бұрын

  • Спасибо ! Выражаю свою благодарность.

    @ksenrix@ksenrix9 ай бұрын

  • Все понятно 👍 теперь осталось запомнить ну и практики

    @XHuntingX@XHuntingX3 ай бұрын

  • лучшая серия (пока смотрю)

    @fab4key@fab4key Жыл бұрын

  • Давай еще уроки про адаптив!!!

    @piston2801@piston28013 жыл бұрын

  • Spasibo vam

    @user-tv4nj9vx6v@user-tv4nj9vx6v2 жыл бұрын

  • Круто-круто!

    @user-ce2vy8lh1j@user-ce2vy8lh1j Жыл бұрын

  • У тебя есть чувство юмора, в конце ты меня рассмешил с лимоном XD

    @cypooboy@cypooboy2 жыл бұрын

  • спс за урок ты топ

    @zxs_DEADinside@zxs_DEADinside6 ай бұрын

  • Подскажите, что можно сделать чтобы сама система не отображала кнопку на калькуляторе, как кнопку поиска? И возможно ли использовать тег button несколько раз но с разными характеристиками? Ширина, длина и т.п.

    @kirillpareev7334@kirillpareev73342 жыл бұрын

  • класс

    @user-np7jz5jm9v@user-np7jz5jm9v2 жыл бұрын

  • Спасибо большое! Очень круто и познавательно!

    @user-gu4oo1ts1c@user-gu4oo1ts1c6 ай бұрын

  • А как сделать так что бы эти лимончики были на одной строке? Что бы один был справа, а другой слева?

    @LEGENDARY192@LEGENDARY192 Жыл бұрын

  • А выпуклым лимончик сделать можно ?

    @rufatbilalov3268@rufatbilalov32683 жыл бұрын

  • здраствуйте , как вы так быстро удалили отступы в atom, какие клавиши использовали?

    @muratbressler6945@muratbressler6945 Жыл бұрын

  • *Вот бы ещё вкус лимончика изменить :3*

    @doctor_risus3941@doctor_risus39412 жыл бұрын

  • Я так понял логика последовательностей значения цифр: это циферблат 12,3,6,9 часов

    @YAMIGE@YAMIGE2 жыл бұрын

  • что сделать, чтобы объект при добавлении внутренних отступов не менял свою форму ? , например у вас этот лимон растянулся

    @teraranime665@teraranime6653 жыл бұрын

  • 🙏🏻

    @TheBigChannel_@TheBigChannel_ Жыл бұрын

  • У меня при создании второго блока, исчезает первый, остается только надпись, которая была внутри него. Скажите, пожалуйста, кто-нибудь, почему?

    @newbrunetteforhim2418@newbrunetteforhim2418 Жыл бұрын

  • 👍

    @Pavel_Derevyanko@Pavel_Derevyanko3 жыл бұрын

  • Здравствуйте, создал такой же блок, написал там объёмный текст, думал он поместиться , а он вылазит за пределы блока, то есть часть в блоке, а часть СНИЗУ, попробовал overflow: hidden - нижняя часть текста лишь убралась, попробовал word-break: break-all - не помогло, разве такие блоки не предназначены для содержания в них текстов?

    @spectorx7256@spectorx72562 жыл бұрын

    • для этого используются отдельные CSS стили

      @grovestreet2126@grovestreet21263 ай бұрын

  • а как текст посередине блока сделать? text-align center не работает

    @pidoras12343@pidoras123435 ай бұрын

  • Какая комбинация клавишь коментирует всю строчку кода? как ты делаешь это в один клик?

    @bleat6333@bleat6333 Жыл бұрын

    • попробуй ctrl + /

      @evfrosa7093@evfrosa7093 Жыл бұрын

  • У меня вопрос, как у него получается применять стили к HTML коду, если CSS не подключен в теле head?

    @awgoodman@awgoodman Жыл бұрын

    • подключен, просто там скрыт код в , поэтому не видно

      @ismeazey3879@ismeazey387910 ай бұрын

  • А как сделать что бы были отступы в браущере.Когда-то я убрал его,когда учил у другого ютубера,потом забросил,вообщем как устоновить отсупы по умолчанию?

    @Im_motorist@Im_motorist11 ай бұрын

    • Не знаю точно, не проверял, но может быть при удалении отступов( * { margin: 0; padding: 0; }) нужно вместо 0 указать другое значение, типо 20px.

      @ismeazey3879@ismeazey387910 ай бұрын

  • почему даже при подключенном файле css не отображаются блоки в google?

    @mariiachyrva7588@mariiachyrva75884 ай бұрын

  • А что делает display: flex; ?

    @The_man_from_hell22@The_man_from_hell224 ай бұрын

  • Ребят, может кто-то знает как сделать текст внутри блока, но чтобы блок был прозрачным, а текст нет?

    @ulyanatrehubava8025@ulyanatrehubava802511 күн бұрын

  • у меня индификатор id работает как АЙДИ как исправить?

    @mixgametv2373@mixgametv23732 жыл бұрын

    • Всем пофиг чел

      @mard9304@mard93042 жыл бұрын

    • @@mard9304 говори за себя

      @Virusnik@Virusnik Жыл бұрын

    • @@mard9304 чёт душно, пойду форточку открою

      @SAMANUELb@SAMANUELb10 ай бұрын

  • Как у тебя работают стили, если ты их не подключаешь?)

    @AnderPython-tw3kp@AnderPython-tw3kp Жыл бұрын

    • Магия монтажа )

      @user-um2eu1dy8t@user-um2eu1dy8t11 ай бұрын

    • он подключает, просто код в теге скрыт

      @ismeazey3879@ismeazey387910 ай бұрын

  • ☦❤💕💕🙏☦❤

    @xeither289@xeither2892 жыл бұрын

  • БОГ ЕСТЬ ЛЮБИТЕ БОГА И СВОИХ БЛИЖНИХ!!!

    @xeither289@xeither2892 жыл бұрын

    • бога нет

      @shiroe2359@shiroe23592 жыл бұрын

    • @@shiroe2359 тебя нет

      @user-mr2pq8cf8e@user-mr2pq8cf8e Жыл бұрын

    • @@user-mr2pq8cf8e я есть. я хожу, дышу, учусь, питаюсь, а Бог просто аымешленная фигура, с помощью которой управляют людьми

      @shiroe2359@shiroe2359 Жыл бұрын

    • @@shiroe2359 Аллах тебя накажет

      @user-mr2pq8cf8e@user-mr2pq8cf8e Жыл бұрын

    • @@user-mr2pq8cf8e откуда ты знаешь, что будет делать аллах? ты его заместитель или доверенное лицо?

      @SAMANUELb@SAMANUELb10 ай бұрын

  • у меня блок не саздактся

    @mixgametv2373@mixgametv23732 жыл бұрын

    • получилось?

      @ArkiShopggg@ArkiShopggg2 жыл бұрын

  • 9:11

    @Termux-nazar-antihack-linux@Termux-nazar-antihack-linux5 ай бұрын

  • ИИСУС ХРИСТОС ЕСТЬ МЕССИЯ И ОН ВОСКРЕС!!!

    @xeither289@xeither2892 жыл бұрын

    • фуу гей

      @shiroe2359@shiroe23592 жыл бұрын

  • Первый))

    @salehplay572@salehplay5723 жыл бұрын

  • Блин,что это за наркомания? Зачем вообще может понадобиться строчный объект представлять как блок?

    @Vlad-sw4zd@Vlad-sw4zd2 жыл бұрын

    • Ну может чтобы ссылке сделать больше высоту и ширину

      @Kuznec822@Kuznec8225 ай бұрын
KZhead