Въведение в Cheatsheet CSS3
Cascading Stylesheet (CSS) е в основата на езика на стила, който се използва за изпълнение на външния вид и форматирането на документ, разработен на език за маркиране. CSS спецификацията се поддържа основно от World Wide Web Consortium (W3C). Основното мото за внедряване на CSS е да покаже разделянето на презентацията и съдържанието, което включва фронтове, формати на оформлението. CSS3 е последната версия или стандарт за CSS след CSS2. CSS3 е основно комбинация от спецификации на CSS2 и някои нови функционалности.
Намерете по-долу няколко важни модула на Cheatsheet CSS3:
- Модел на кутия
- селектори
- Текстови ефекти
- 2D трансформации
- 3D трансформации
- Представяне на изображение
- Потребителска интерфаза
- Множество оформления на колони
- Анимации
- Корекция на съдържанието и пренасочване
В тази статия на Cheatsheet CSS3 ще обсъдим какво е CSS3 и различните CSS3 команди.
Команди и съдържание в Cheatsheet CSS3
CSS3 има обширна библиотека, интерактивен, разширяващ се и съдържа много вградени методи за изчисляване на общи операции. По-долу са споменатите командите Cheatsheet CSS3, които изпълняват различни операции в командния ред:
|
COMMAND |
ОПИСАНИЕ |
| : фокус | За да се съсредоточите върху елемент |
| : активен | За показване и избор на активен елемент |
| : разрешено | За показване на активиран елемент |
| : проверено | За да се покаже елемент, който е проверен |
| : lang | За да се даде възможност на програмиста да посочи езика за конкретен елемент |
| : избор | За да се покаже елементът, който е маркиран и избран |
| : корен | За показване на основния елемент в документа |
| :първо дете | За показване на първия елемент на братята |
| :последно дете | За показване на последния елемент на братята |
| :единствено дете | За да се покаже единственият дочамен елемент |
| : Първата по вид | За да се покаже първият елемент на братя от определен тип |
| : Последната от тип | За да се покаже последният елемент на братя от определен тип |
| : Само-на-тип | За да се покаже единственият елемент на братя от определен тип |
| : празен | За да се покаже елементът, който няма деца |
| ::първа буква | За да добавите специфичен стил към първата буква на текст |
| ::първа линия | За да добавите конкретен стил към първия ред на текст |
| :: след | За да вмъкнете малко съдържание след текстов елемент |
| :: преди | За да вмъкнете малко съдържание преди текстов елемент |
Оператори: - Различните видове оператори в CSS3 са оператори за сравнение (релационни), оператори за присвояване, логически оператори и оператори за идентичност.
Везни за измерване: Везни за измерване CSS3 на мамят са както следва
|
SCALE / ПАРАМЕТЪР |
ОПИСАНИЕ |
| ем | Размер на шрифта на текущия елемент |
| бивш | Височина на шрифта на елемента |
| пиксела | Преглед на пиксела на устройството |
| вещни | Размер на шрифта на коренния елемент |
| вх | Височина на Viewport |
| VW | Ширина на Viewport |
| % | Процент |
| настолен компютър | цицер |
| pt | Точка |
Код на цвета: Име на цвят = червено, синьо, зелено и тъмно зелено. Намерете по-долу кодовете за същото
|
CODE |
ОПИСАНИЕ / СЪЩНОСТ |
| RGB (X, Y, Z) | За червено = rgb (255, 0, 0) |
| RGB (х%, у%, Z%) | За червено = rgb (100%, 0, 0) |
| #RRGGBB | За червено = # ff000 |
| flabor | Избран от потребителя цвят, за да персонализира интерфазата на потребителя |
| RGBA (X, Y, Z, а) | За червено = rgb (255, 0, 0) |
User Interphase Properties: CSS3 Интерфазните свойства на потребителя на Cheat sheet са както следва.
|
СТОЙНОСТИ НА ИМОТИТЕ |
ОПИСАНИЕ |
| икона | За да предоставите иконата на площ |
| преоразмеряване | За преоразмеряване на посочените елементи от областта |
| кутия оразмеряване | За фиксиране на зададената област от елемент |
| външен вид | За изпълнение на елементите като UI елементи |
| навигационно меню | За да се придвижвате надолу елементите според бутона на стрелката надолу |
| навигация наляво | За да се придвижите наляво елементите според бутона на клавиатурата с лява стрелка |
| NAV-нагоре | За придвижване нагоре елементите според бутона на клавиатурата лява стрелка |
| навигация десен | За да се придвижите вдясно елементите според бутона на клавиатурата надясно |
| контур-офсет | За да нарисувате очертанията на избраната текстова област |
Селекторни типове : Чит-лист CSS3 селекторите са както следва.
|
ИМЕ НА ТИПА |
ОПИСАНИЕ / СЪЩНОСТ |
| универсален | За показване на всеки елемент |
| Тип | За показване на всеки специфичен тип елемент |
| клас | За показване на множество елементи от различни типове |
| Документ за самоличност | За показване и идентифициране на един конкретен тип елемент, без да засяга други |
| дете | За да се покаже елемент, който директно попада под падания под друг елемент |
| Групирането | За идентифициране на множество елементи от различни типове |
| Съседна сестра | За да получите всички елементи, които имат един и същи родител и елементи и са в непосредствена последователност |
| Общи братя и сестри | За да получите всички елементи, които имат един и същ родител и елементи и не е непременно в непосредствената последователност |
Безплатни съвети и трикове за използване на Cheat лист CSS3 команди: -
- CSS3 режимът на смесване може да се използва за унифициране на външния вид на определеното съдържание, а също така дава възможност на потребителите да задават различни версии на цвета на изображението. В CSS3 Cheat Sheet присъстват около 15 стойности за режим на смесване. Освен това добавя допълнително предимство от гледна точка на интерфазно представяне на потребителите.
- Изрязването е друга отлична характеристика на CSS. Използвайки функцията за изрязване, потребителят може да определи видимостта на зоната на изображението според изискването. Така че, ако някоя част от изображението попадне извън желаната област, тогава може да се реализира изрязването, за да се скрие тази допълнителна област на изображението.
- В случай на CSS, свойства във формата и отвън могат да бъдат реализирани, за да обвият съдържанието около персонализирания път за CSS и той може да бъде определен и разпределен според изискванията на крайния потребител. По същество позволява на потребителя да проектира интерфазата според дефинираните спецификации.
- Използването на SVG (мащабируема векторна графика) анимация е друго предимство за CSS3. Използвайки SVG с CSS3 анимация, интерфазата ще стане по-интерактивна и SVG също има собствен DOM API.
- Функцията за карта ще бъде приложена към всички елементи във входен списък.
- Функцията намаляване се използва за прилагане на някои изчисления в списък и връща стойност
- Hover Effects могат да бъдат реализирани с помощта на CSS3 Cheat Sheet
- Gooey меню може да бъде реализирано с помощта на CSS3 и SVG филтри и това подпомага нов представителен подход от гледна точка на потребителската интерфаза
- От гледна точка на уеб дизайна, паралакс ефектите могат да бъдат произведени с помощта на CSS3.
- Интерактивната 3d структура и интерфаза на потребителя могат да бъдат произведени с помощта на CSS3
- Използвайки различна комбинация от селектори, иконата на файлов формат до връзката за изтегляне може да бъде създадена с помощта на CSS3.
заключение
В тази статия на Cheat sheet CSS3 видяхме, че CSS3 е лесен за използване и синтаксисът му е по-лесен за запомняне. CSS3 може да се използва при представянето на технологиите за уеб разработка, като се използват различни подходи и технологии за стилове, които поддържат CSS3. Въз основа на типа потребност на проекта, времето на работа и на всички други различни дискутирани аспекти, CSS3 трябва да се използва за постигане на желаната цел.
Препоръчителни статии
Това е ръководство за Cheat sheet CSS3, тук сме обсъдили съдържанието и командата, както и безплатни съвети и трикове на Cheat sheet CSS3, можете също да разгледате следната статия, за да научите повече -
- CSS Cheat Sheet CSS
- Чит лист HTML
- Невероятна махлярска листа за UNIX
- Cheat Sheet JavaScript: Функции