Как оформлять CSS код. Советы начинающим!

  Рет қаралды 17,837

BrainsCloud

BrainsCloud

6 жыл бұрын

В этом видео рассмотрим как оформлять CSS код вашего сайта. Разберем несколько правил написания красивого CSS кода, которых желательно придерживаться, чтобы ваш код был красивым, удобным и структурированным.
---------------------------------------------
Сайт: brainscloud.ru/
Добавляйтесь в друзья: odimaz
Мой инстаграм: / dmitryvalak
#верстка #html #css #css3

Пікірлер: 51
@bobkacmopkobko5867
@bobkacmopkobko5867 5 жыл бұрын
понравилось видео, с меню навигации вообще прям лайфхак.
@user-sv6kt1zd5b
@user-sv6kt1zd5b 6 жыл бұрын
выверенная методика подачи. Одни из лучших обучающих видео по верстке на ютубе. Большая просьба продолжать. И вообще, убежден, что по настоящему, по сути, по факту ОБУЧАЮЩИЙ ПРОЕКТ ДЛЯ НАЧИНАЮЩИХ, дающий реальные знания и навыки - а это очень сложно на самом деле, поэтому таких программ законченных практически может быть единицы, а то и вовсе нет - привлечет сотни тысяч подписчиков в сети. Спрос на методологию по реальным навыкам громаден. Особенно сейчас, когда миллионы людей в возрасте до 70 лет в русскоговорящем пространстве находятся на социальном переломе. А скажем так, миллион подписчиков, лайков и коментов по любому быстро монетизируются. Это хорошо просекают забугорные спецы, поэтому сегодня лучшие обучающие доходчивые обучающие методики в англоязычном сегменте. Так что желаем вам удачи!!!
@BrainsCloud
@BrainsCloud 6 жыл бұрын
Спасибо ) Да, согласен, англоязычные курсы намного впереди наших. Будем расти )
@user-on9tu4zp1t
@user-on9tu4zp1t Жыл бұрын
так же считаю
@Kristina-zn3co
@Kristina-zn3co 3 жыл бұрын
Спасибо за полезную информацию!!!
@MyName-ct2nc
@MyName-ct2nc 4 жыл бұрын
То чувство, когда ты полный нуб в верстке, но чувство прекрасного совпало с автором и ты сразу стал так группировать. Со списками тоже классно. Дима, спасибо за классные уроки. Подумываю про твои платные курсы.
@user-mm3nw4xk4v
@user-mm3nw4xk4v 2 жыл бұрын
Спасибо)))))) сегодня ломала глаза об бардак в своем коде, благодаря вам больше так не буду 😁
@AlexanderShutter
@AlexanderShutter 3 жыл бұрын
Отличные советы. Спасибо
@user-fd6dv5fb3z
@user-fd6dv5fb3z 3 жыл бұрын
Великолепно,- применю в своей практике будущей.Спасибо.
@smert-chekistam
@smert-chekistam 3 жыл бұрын
Спасибо, человечище 🙂
@user-ct8xz5cm8e
@user-ct8xz5cm8e 2 жыл бұрын
Спасибо! Было полезно, особенно с меню навигации
@user-ol3nf5pu7y
@user-ol3nf5pu7y 5 жыл бұрын
Спасибо 🙏
@user-xe8zz4lo4t
@user-xe8zz4lo4t 2 жыл бұрын
Отлично 👍
@sovetit
@sovetit 6 жыл бұрын
Всё верно, даже добавить не чего! Я всегда ставлю px даже если 0 не знаю почему привычка, все равно всю основную работу делают CSScomb + модуль SASS. На счёт комментариев да я ставлю в начале блоков, но карту блоков вверху не делаю, думаю нужно взять на заметку, спасибо!
@user-yx4nt6hw1k
@user-yx4nt6hw1k Жыл бұрын
Лучшие!
@MegaOooleg
@MegaOooleg 2 жыл бұрын
Дааа, у меня было, записал правило где-то внутри селектора, потом забыл, написал опять тоже правило с другим значением, но выше предыдущего, дооолго чесал репу, почему правило неправильно работает. А оно тупо перезаписалось)) я же ещё новичек. Полезная инфа, спасибо!
@AlekMuz
@AlekMuz 3 жыл бұрын
super
@user-zw5wn9cn7t
@user-zw5wn9cn7t Жыл бұрын
Тада, дисциплина кода полезная практика.
@user-om4bq8uf1s
@user-om4bq8uf1s 3 жыл бұрын
придерживаюсь почти всех правил. а одинаковости отступов особенно)) так как я пишу на Стайлусе, здесь это критично)
@pcgames7982
@pcgames7982 2 жыл бұрын
👍
@oleksiib.9762
@oleksiib.9762 4 жыл бұрын
Лучше группировать свойства по алфавиту, это позволит быстрее находить как нужные, так и дублируемые свойства. И автоматизировать в Sublime это можно с помощью F9...
@user-cl3ej8mt9i
@user-cl3ej8mt9i 6 жыл бұрын
по поводу отступов и тд это конечно хорошо , но мы будем в конце все равно пропускать все через компрессор , и наши отступы и тд не кто не увидит , а следующий просто пройдется "расческой" и все у него будет норма ) а по поводу в самом верху навигации очень полезно , спасибо )
@BrainsCloud
@BrainsCloud 6 жыл бұрын
Как никто не увидит? Вы сами, вам же работать с кодом ) обычно есть рабочие файлы и скомпилированные, наверняка встречали, папка src и build/dist. Я же это не придумываю, а своим опытом делюсь )
@unknown.6914
@unknown.6914 3 ай бұрын
Были бы здесь индусы, они б показали секретные техникики и наработки :)))
@sovetit
@sovetit 6 жыл бұрын
Секретная техника в css у меня - (то что ты показывал разбитие на группы) - этим как раз занимается на мой взгляд не заменимый плагин CSScomb который есть и на Brackets, пробовал его на Brackets но как то он у меня не срабатывал. Но я рекомендую всем и тебе Дмитрий, использовать или хотя бы попробовать Sublime Text 3 верю что пробовали, но с выходом последнего релиза просто улёт, запускается в пол секунды + я долго искал редактор чтоб всё в одном было, наконец нашёл для себя и теперь работаю как с php так и css правда его нужно только настроить под это дело. Вообщем за счёт своей скорости плагинов которые работают отлично и без сбоев, можно сказать Sublime стал для меня полноценным и единственным редактором для веб программирования.
@BrainsCloud
@BrainsCloud 6 жыл бұрын
Оке, надо будет попробовать
@point111
@point111 6 жыл бұрын
Очень страно, что спец такого уровня саблайм будет только пробовать. Для него написано такое количество плагнов, что он становится универсальным редактором под любой язык. Настраевашь его под свои задачи и збываешь по другие редакторы. Есть всё, к чему ты привык в брекете - эммет, подсветка начала и конца тега в которм находися курсор, подсвека цветом значенй rgb, выравнивание кода ступенями по вложености (о чем это видео), немного повозившись можно прикрутить линтер html css js php, автоматическое копирование сохраненого файла по фтп в нужную директорию на хостинге, автоматическое дописывание префиксов для кросбраузерности и огромная куча неведомых плюшек для чего угодно. Всё ставится плагинами, т. е. в редакторе только нужное лично тебе.
@BrainsCloud
@BrainsCloud 6 жыл бұрын
P0INT111 а что странного? Мне по большому счету нужен только emmet, остальное делает сборщик. Скачал сублайм и кроме эммета пока ничего не поставил ) подскажите полезные плагины?
@point111
@point111 6 жыл бұрын
зквтра,сейчас уже сплю
@sovetit
@sovetit 6 жыл бұрын
Список самых полезных плагинов: Emmet Gulp GitGutter Sass CSScomb Color Highlighter AutoFileName Autoprefixer PHP Companion SublimeLinter SublimeLinter-php SublimeLinter-phplint DocBlockr Что касается синтаксиса php, то сейчас скрины выложу чтоб тебе не искать в настройках SublimeLinter
@Yakyzzza93
@Yakyzzza93 3 жыл бұрын
читаемый кот=)
@user-jk4lu2rm6z
@user-jk4lu2rm6z 6 жыл бұрын
блин мужик я рад что ты вернулся а уроки по php будут ?
@BrainsCloud
@BrainsCloud 6 жыл бұрын
Будут 💪
@user-jk4lu2rm6z
@user-jk4lu2rm6z 6 жыл бұрын
класс
@artluk06
@artluk06 3 жыл бұрын
@@BrainsCloud а где уроки?(
@KapitanDi
@KapitanDi 4 ай бұрын
Отличное видео, спасибо. А есть ли что то подобное для совсем начинающих. Вот вы сказали: ... селектор .container , то есть точка перед container это определяется как селектор? Но есть "#" такой знак - что он означает? Где можно найти эту азбуку? В многих учебниках об этом не упоминают, как будто это уже все знают. Спасибо
@ImpulseYou
@ImpulseYou 6 жыл бұрын
Будут ли уроки, советы и тд по backend?
@BrainsCloud
@BrainsCloud 6 жыл бұрын
Уроки будут
@user-jm3cy6wn3b
@user-jm3cy6wn3b 6 жыл бұрын
Какой ты редактор используешь в этом уроке ? Какое название программы ?
@BrainsCloud
@BrainsCloud 6 жыл бұрын
Brackets
@gign_141
@gign_141 Жыл бұрын
Сокровище. Не иначе. Спасибо за ваши видео!
Что такое TCP/IP: Объясняем на пальцах
15:38
Live Preview HTML Files- Phoenix Code
0:35
Phoenix Code Editor
Рет қаралды 133
Mama vs Son vs Daddy 😭🤣
00:13
DADDYSON SHOW
Рет қаралды 47 МЛН
Эффект Карбонаро и нестандартная коробка
01:00
История одного вокалиста
Рет қаралды 10 МЛН
Пранк пошел не по плану…🥲
00:59
Саша Квашеная
Рет қаралды 6 МЛН
لقد سرقت حلوى القطن بشكل خفي لأصنع مصاصة🤫😎
00:33
Cool Tool SHORTS Arabic
Рет қаралды 21 МЛН
PX, EM, REM - Единицы измерения в CSS
15:03
BrainsCloud
Рет қаралды 33 М.
Что такое CSS?
5:20
loftblog
Рет қаралды 63 М.
sticky header using pure html css with source code
2:51
Tarun Code
Рет қаралды 44
BRASIL X FRANÇA AO VIVO -  OLIMPÍADAS 2024 | QUARTAS DE FINAL
Na Rede Oficial
Рет қаралды 8 М.
простая кнопка в Adobe XD
4:21
Анна Потапенко
Рет қаралды 1,8 М.
Как скачать Brackets.
3:11
Coting
Рет қаралды 43
Создаем свое ANDROID приложение на PYTHON
13:55
Чёрный Треугольник
Рет қаралды 204 М.
Mama vs Son vs Daddy 😭🤣
00:13
DADDYSON SHOW
Рет қаралды 47 МЛН