Шпаргалки по: 10 шпаргалок по HTML и CSS — Tproger
10 шпаргалок по HTML и CSS — Tproger
Чтобы не теряться в океане тегов и атрибутов, забирайте наиболее полные шпаргалки по HTML и CSS. Никакой воды — максимум пользы.
- Шпаргалки по HTML
- Шпаргалки по CSS
Шпаргалки по HTML
Язык гипертекстовой разметки — основа фронтенда, её скелет, на который вешаются стили и функционал. Самая последняя версия — HTML5: поддерживает все теги и элементы. Так, с появлением HTML 5 были добавлены новые типы ввода:
email
для ввода электронной почты:<input type="email" name="user_email" />
url
для соответствующих input-полей:<input type="url" name="user_url" />
number
для числовых значений:<input type="number" name="points" min="1" max="10" />
range
для диапазона чисел:<input type="range" name="points" min="1" max="10" />
- Выбор даты:
<input type="date" name="user_date" />
- Выбор цвета:
<input type="color" name="user_color" />
. Opera позволит выбрать цвет из палитры, а Chrome разрешит отправлять форму только с шестнадцатеричным значением.
Держите шпаргалку по HTML4 и HTML5. Там же вы сможете найти различные спецификации поддержки и совместимости для десктопа и мобильных устройств для HTML 5 в разных браузерах.
А в следующих двух шпаргалках представлены символьные объекты HTML. Что это такое? Некоторые символы зарезервированы за HTML-разметкой, а потому не могут использоваться напрямую, поскольку есть шанс поломать вёрстку. Например, чтобы прописать левую или правую угловую скобку (<>
) в статье, мы записываем их в HTML как <
и >
соответственно. В противном случае затронем теги вёрстки.
Вот сами чит-листы по HTML-символам:
Полная версия: https://cheatography.com/davechild/cheat-sheets/html-character-entities/
Полная версия: https://cheatography.com/reverseemf/cheat-sheets/html-character-entities/
То же самое, но на русском вы найдёте на htmlbook. ru.
Следующая шпаргалка содержит основные теги HTML5:
Полная версия: https://cheatography.com/kenlandtan/cheat-sheets/html-5/
Также держите расширенную шпаргалку с тегами HTML5: четыре страницы с подсказками отлично подойдут, чтобы подготовиться к собеседованию.
Но перед тем, как перейти к CSS, нельзя не отметить едва ли не самую удобную шпаргалку по HTML, которая выручит в любой ситуации, будь то подготовка к интервью или рабочий процесс.
Шпаргалки по CSS
Каскадные таблицы стилей, они же CSS, описывают, как именно HTML-элементы будут отображаться. При этом один и тот же стиль может применяться сразу к нескольким элементам или даже страницам.
При первом знакомстве с CSS могут возникнуть проблемы с обозначением единиц измерения. Некоторые из них пришли из типографской традиции, как пункт (pt
) и пика (pc
), другие, например сантиметр (cm
) и дюйм (in
), знакомы нам из обихода. Есть и специальная единица измерения, придуманная специально для CSS: px
.
Держите шпаргалку по единицам измерения в CSS, чтобы не запутаться:
Источник: https://cheatography.com/rahilkasimi/cheat-sheets/css-units-cheatsheet/
А ещё есть селекторы, которые определяют, к какому элементу применять то или иное CSS-правило. Если вас интересуют CSS-селекторы, то вам сюда:
Полная версия по ссылке
А вот ещё одна удобная шпаргалка по CSS, которая собрала в себе максимум полезной информации. Также посмотрите, как правильно использовать CSS-селектор :has().
Надеемся, что шпаргалки по HTML и CSS оказались полезными. Чит-листы по каким языкам и технологиям вы хотели бы увидеть? Напишите в комментариях.
Реклама на Tproger: найдем для вас разработчиков нужного стека и уровня.
Подробнее
Реклама на tproger.ru
Загрузка
Шпаргалки, Русский язык
Архив
Русский язык
-
1) Пунктуация
-
1. Принципы русской пунктуации, функции и виды знаков препинания.
-
2. Знаки препинания в конце предложения.
-
3. Тире между членами предложения.
-
4.
Знаки препинания при однородных членах.
-
5. Знаки препинания при повторяющихся словах.
-
6. Знаки препинания в предложениях с обособленными членами предложения.
-
7. Уточняющие, пояснительные и присоединительные члены предложения.
-
8. Знаки препинания при сравнительных оборотах.
-
9. Знаки препинания при вводных словах и словосочетаниях
-
10.
Знаки препинания при обращениях.
-
11. Знаки препинания при междометиях, утвердительных и отрицательных словах.
-
12. Знаки препинания в сложных предложениях.
-
13. Знаки препинания при прямой речи и цитировании.
-
14. Сочетание знаков препинания, авторское употребление знаков препинания.
-
-
2) Орфография
-
1. Принципы русской орфографии, орфограмма
-
2.
Употребление прописной и строчной буквы.
-
3. Правила переноса слов
-
4. Правописание гласных в корне.
-
5. Правописание гласных после шипящих и Ц.
-
6. Правописание согласных в корне.
-
7. Правописание приставок.
-
8. Правописание разделительных Ъ и Ь Правописание разделительного ъ (твердого знака).
-
9.
Правописание имён существительных.
-
10. Правописание имен прилагательных. Правописание окончаний имен прилагательных.
-
11. Правописание сложных слов.
-
12. Правописание числительных.
-
13. Правописание местоимений.
-
14. Правописание глаголов.
-
15. Правописание причастий.
-
16.
Правописание наречий.
-
17. Правописание предлогов.
-
18. Правописание союзов.
-
19. Правописание частиц НЕ с разными частями речи, НЕ и НИ.
-
-
4) Речь
-
1. Речевая деятельность
-
2. Текст и их типы
-
-
5) Синтаксис
-
1.
Словосочетания, их виды
-
2. Предложение
-
3. Виды предложений по цели высказывания и эмоциональной окраске
-
4. Порядок слов в предложении, интонация, логическое ударение. Средства оформления предложения.
-
5. Главные члены предложения: подлежащее! сказуемое.
-
6. Второстепенные члены предложения
-
7. Типы односоставных предложений:
-
8.
Полные и неполные предложения.
-
9. Распространенные и нераспространенные предложения
-
10. Однородные члены предложения, обобщающие слова
-
11. Обособленные члены предложения,
-
12. Обращение
-
13. Водные слова или словосочетания
-
14. Вставные конструкции
-
15.
Сложносочинённое предложение
-
16. Бессоюзные сложные предложения
-
17. Сложноподчинённые предложения
-
18. Синтаксические синонимы
-
19. Способы передачи чужой речи: прямая и косвенная речь.
-
-
6) Морфология
-
1. Имя существительное
-
2. Имя прилагательное
-
3.
Имя числительное
-
4. Местоимение
-
5. Глагол
-
6. Причастие
-
7. Деепричастие
-
8. Наречие
-
9. Слова категории состояния
-
10. Предлог
-
11.
Союзы
-
12. Частицы
-
13. Междометия, звукоподражательные слова
-
-
7) Морфемика и словообразование
-
1. Морфемика, морфемы, их виды
-
2. Чередование звуков в слове.
-
3. В зависимости от количества корней в основе слова выделяются:
-
4. Однокоренные (родственные) слова
-
5.
Этимология
-
6. Словообразование
-
-
9) Лексика
-
1. Понятие лексики, слово.
-
2. Лексическое значение слова
-
3. Омонимы
-
4. Синонимы
-
5. Антонимы
-
6.
Разряды слов по происхождению.
-
7. Устаревшие слова и неологизмы.
-
8. Лексика ограниченной сферы употребления:
-
-
11) Фонетика
-
1. Фонетика, звук, гласные и согласные
-
2. Слог
-
3. Словесное ударение
-
4. Интонация
-
-
12) Общие сведения о русском языке
-
1.
Русский язык как национальный язык русского народа, государственный язык российской федерации и язык межнационального общения.
-
2. Русский язык как первоэлемент великой русской литературы.
-
3. Русский язык в современном обществе. богатство, красота и выразительность русского языка.
-
4. Место русского языка среди других языков. русский язык как один из индоевропейских языков.
-
5. Наука о русском языке
-
самых просматриваемых шпаргалок — Cheatography.
com: шпаргалка на все случаи жизни
Краткое руководство по регулярным выражениям (regex) , включая символы, диапазоны, группировку, утверждения и некоторые примеры шаблонов, которые помогут вам начать работу.
DaveChild
19 11 октября, обновлено 12 20 марта
разработка, регулярные выражения, регулярные выражения, программирование
2 страницы
(273)
Памятка по командной строке Linux
Памятка по командам, которые я использую чаще всего Linux, со всплывающими ссылками на справочные страницы.
DaveChild
28 октября 11, обновлено 29 февраля 20
bash, nano, linux, ls, командная строка и еще 4 …
1 страница
9000 2 (0)
Сочетания клавиш emacs
jona5
26 Июн 16
emacs
2 страницы
90 003 (97)
Памятка по Python
Памятка по Python — это одностраничный справочник по язык программирования Python.
DaveChild
19 окт 11, обновлено 21 ноя 22
разработка, питон, программирование, джанго, колба
10 страниц
(4)
Памятка для переходных военнослужащих
Переходных военнослужащих
xfaith
29 марта 17, обновлено 29 мар 23
армейский, морской, военный, переходный, дод и еще 18 . ..
2 страницы
(32)
Советы по эквалайзеру Памятка
Советы по эквалайзеру. По частоте, по приборам с глоссарием.
fredv
15 ноябрь 11, обновлено 13 май 16 (497)
Шпаргалка по читографии
Шпаргалка для создания шпаргалки по читографии.
DaveChild
19 14 февраля, обновлено 14 22 марта
читография, веб-сайт, чит, лист, мета
2 страницы
(97)
Шпаргалка по PHP
Краткое справочное руководство по PHP со ссылками на функции, руководством по синтаксису регулярных выражений и справочником по функциям форматирования даты в PHP. По состоянию на 28.06.14 шпаргалка теперь включает всплывающие ссылки на соответствующие страницы руководства по PHP.
DaveChild
19 11 октября, обновлено 29 февраля 20
php, разработка, лампа, программирование, веб
1 Страница
(17)
Сочетания клавиш VLC (Windows и OS X)
Полезные сочетания клавиш для OS X и Windows. Знаете ли вы, что вы можете легко повторно синхронизировать аудио и субтитры?
shaunumb
22 янв 12, обновлено 25 февр 20 03 (112)
Памятка по AngularJS
Официальная — неофициальная шпаргалка по AngularJS.
ProLoser
9 авг 12, обновлено 29 фев 20
javascript, beginner, middle, framework, angularjs, angular
2 страницы
900 03 (43)
mod_rewrite Памятка
Шпаргалка по mod_rewrite — краткое справочное руководство по mod_rewrite с флагами перезаписи, синтаксисом регулярных выражений и образцами правил.
DaveChild
19 окт 11, обновлено 25 фев 20
разработка, переписывание, мод-переписывание, apache, lamp и еще 4 …
22 страницы
90 002 (13)
Справочная шпаргалка по C
C Синтаксис, типы данных, структура и общие библиотечные функции
Эшлин Блэк
28 янв. функции, кодирование, c и еще 2 …
2 страницы
(78)
Памятка по MySQL
Памятка по базе данных MySQL.
DaveChild
19 октября 11, обновлено 25 февраля 20
php, разработка, mysql, лампа, база данных, сервер
1 страница
(3)
Сочетания клавиш для ноутбука Jupyter
Памятка по сочетаниям клавиш для ноутбука Jupyter
weidadeyue
21 марта 16, обновлено 10 мая 16
jupyter
2 страницы
900 03 (15)
Соотношение ингредиентов для приготовления лосьона Памятка
Соотношение ингредиентов для лосьона Изготовление
emmajane
29 января 12, обновлено 11 мая 16
ингредиенты, крем, рецепты, уход за кожей, лосьон
2 страницы
(13)
Шпаргалка по покеру
Ранги рук, шансы и основные правила игры в техасский холдем, пятикарточный дро-покер и семикарточный стад.
DaveChild
5 13 апр, обновлено 11 20 мар
игры, новичок, техас, розыгрыш, карты и еще 5 …
2 страницы
(29)
Шпаргалка по французскому языку
Шпаргалка с английского на французский с полезными словами и фразами, которые можно взять с собой в отпуск.
DaveChild
19 окт. 11, обновлено 26 фев. 20
язык, франц., франц., франц., английский и еще 2 …
английский, франц. (французский)
1 стр.
(1)
Сочетания клавиш для медиаплеера mpv
Сочетания клавиш для медиаплеера mpv
Кто-то
4 15 апреля, обновлено 22 сентября 16
видео, аудио, плеер, мультимедиа, субтитры, MPV
2 страницы
(21)
Sublime Text 2 сочетания клавиш Windows
сочетания клавиш для Sub липовый текст 2 для Windows. Запятые указывают на нажатие одной клавиши, затем другой (Ctrl+K, 1 = удерживайте клавишу управления, нажмите K, затем нажмите 1). Косая черта указывает параметры, Alt + Shift + 2/3/4 означает, что нужно удерживать Alt и Shift, затем нажать 2, 3 или 4.
njovin
27 13 марта , обновлено 13 16 мая
ide, клавиатура, редактор, окна, возвышенное, текст
1 Страница
(1)
Шпаргалка по дискретной математике
Уравнения, обычно используемые в дискретной математике
Dois
30 октября 13, обновлено 13 мая 16
математика, образование, дискретное, уравнения, вероятность и еще 5 …
Создайте шпаргалки! — Cheatography.com: Шпаргалки на все случаи жизни
Как составить шпаргалку
Шпаргалка — это бесплатный краткий справочник по чему угодно. Обычно он состоит из набора блоков содержимого. Чтобы создать шпаргалку, вы добавляете столько полей с содержимым, сколько хотите, в пустую шпаргалку, а когда вы закончите, вы нажимаете «Опубликовать», чтобы другие люди могли ее увидеть.
Я вижу, что вы еще не зарегистрированы (или не вошли в систему). Итак, прежде чем мы продолжим это краткое руководство, не могли бы вы зарегистрироваться здесь или войти в систему, пожалуйста?
Начнем! Нажмите здесь, чтобы дать вашей новой шпаргалке имя!
После того, как вы назвали свою шпаргалку, вы можете выбрать:
- Цвет вашей шпаргалки
- Сколько столбцов вы хотите в шпаргалке
- тегов, чтобы помочь другим людям найти вашу шпаргалку
Когда вы редактируете и добавляете шпаргалку, новые PDF-файлы будут создаваться автоматически. Нажмите на ссылку «Загрузки» в левом верхнем углу страницы шпаргалки, чтобы просмотреть последний PDF-файл. (Может быть написано «Создание новых PDF-файлов», и в этом случае вам нужно будет подождать некоторое время, чтобы завершить процесс сборки, прежде чем вы сможете загрузить новый PDF-файл. )
Каждая шпаргалка состоит из блоков содержимого и на Cheatography есть несколько различных типов блоков на ваш выбор:
Обычный
- Текст
Текстовый блок — это простой тип содержимого. Все, что вы вводите в поле, отображается на странице! - Код
Блок кода аналогичен текстовому блоку, за исключением того, что он сохраняет пробелы и использует моноширинный шрифт. Идеально подходит для добавления кода в шпаргалку.
Списки
- От одной до четырех колонок
Блоки списка чаще всего используются в Cheatography. Они могут состоять из одного-четырех столбцов содержимого и отображаться в чередующихся строках, чтобы их было легче читать. Они похожи на таблицы и идеально подходят для небольших фрагментов справочного материала. - Гистограмма
Тип содержимого гистограммы принимает ряд меток и числовых значений и создает простую гистограмму на основе результата. - Вопросы и ответы
В блоках вопросов и ответов отображается вопрос, за которым следует ответ с отступом под ним. (Они также полезны для перечисления команд командной строки с пояснениями после них.)
Носитель
- Изображение
Иногда текст недостаточно хорош, поэтому, если вы чувствуете необходимость, добавьте несколько изображений в свои шпаргалки! Логотипы, схемы, фотографии — все будет работать. Стоит иметь в виду, что PDF не позволяет людям легко увеличивать масштаб, поэтому постарайтесь, чтобы ваши изображения не были слишком большими, если это возможно. - Видео
Блоки видеоконтента не работают с PDF-файлами, но для веб-версий шпаргалок они идеально подходят для добавления мультимедийного контента. Тип контента видео поддерживает YouTube и Vimeo.
Прямая трансляция
- Прямая трансляция
Прямая трансляция регулярно обновляется с URL-адреса в Интернете. Для получения дополнительной информации нажмите здесь.
Структурный
- Разрыв столбца
Этот тип содержимого влияет на файлы PDF и заставляет следующий блок содержимого начинаться в новом столбце. - Разрыв страницы
Этот тип содержимого влияет на PDF-файлы и заставляет следующий блок содержимого начинаться на новой странице.
Часто задаваемые вопросы
Зачем мне «опубликовывать» шпаргалку?
Публикация вашей шпаргалки означает, что она переходит из статуса черновика, где ее можете видеть только вы, в статус опубликования, где ее могут видеть все. Вы по-прежнему можете редактировать шпаргалку после ее публикации. Самые последние опубликованные шпаргалки очень заметны на сайте, поэтому лучше подождать, пока вы не будете довольны своей работой, прежде чем публиковать ее.
Могу ли я использовать изображения или видео в шпаргалке?
Да, можно! Для медиа есть два типа блоков — изображения и видео. Изображения загружены на сайт и будут добавлены в версии PDF. На видео можно ссылаться на YouTube или Vimeo, но они не добавляются в PDF-файлы — вместо этого мы добавляем ссылку на видео.
Могу ли я увидеть примеры различных типов блоков?
Да! Там (почти неизбежно) есть шпаргалка для создания шпаргалки по читографии. Какая чудесная цикличность.
Что случилось с «блоками контента»?
В первой версии Cheatography блоки контента на странице были доступны независимо от шпаргалок, но это делало создание шпаргалок слишком сложным и медленным, поэтому мы упростили его. Блоки контента остались, но теперь вы добавляете и редактируете их прямо со страницы шпаргалки.
Советы! Делайте:
Спросите об отзыве! Свежий взгляд поможет вам определить области, которые нуждаются в большей детализации.