❞ كتاب Sass Tutorial (PDF Version) - Tutorialspoint ❝

Sass Tutorial (PDF Version) - Tutorialspoint

ال SASS هي عبارة عن لغة تضاف كملحق ل css يمكنها أن تجعل من عملك أسرع وأقصر وأقل جهدا, وهي أكثر استقرارا, وتطورا واحترافية من ال css التقليدي, وتتوافق كليا مع أوامر ال css وبنيتها التركيبية, وتستخدم كوسيلة مختصرة لإنشاء شيفرات ال css البرمجية وتعدم مجموعة من الأمور التي غالبا ما نراها في البرمجة مثل تعريف المتغيرات أو التداخل أو تضمين الملفات ..الخ من الأمور الرائعة ..





هذه الدورة مهمة لمصممين ومطورين االمواقع والذين يعملون على ال CSS لتنسيق الصفحات ... وخصوصا ال front-end





—المقدمة


—ما هو ال SASS


—لماذا أستخدم ال SASS


—طريقة تنصيب ال SASS


—بعض من ال command line المهمة في ال compass


—مثال على استخدام ال compass والSass قبل البدأ


—SASS Syntax


—Data types


—المتغيرات


—التداخل


—Partials


—Import


—Mixins


—Extend/Inheritance


—Operators


—Operators & use function


—If & loops


—If & loops @for))


—@each))If & loops

s
About the Tutorial ............................................................................................................................................ i
Audience........................................................................................................................................................... i
Prerequisites..................................................................................................................................................... i
Copyright & Disclaimer..................................................................................................................................... i
Table of Contents ............................................................................................................................................ ii
1. SASS – Overview .......................................................................................................................................1
What is SASS? ..................................................................................................................................................1
Why to Use SASS?............................................................................................................................................1
Features of SASS..............................................................................................................................................1
Advantages of SASS .........................................................................................................................................2
Disadvantages of SASS.....................................................................................................................................2
2. SASS – Installation ....................................................................................................................................3
Installation of Ruby..........................................................................................................................................3
3. SASS – Syntax..........................................................................................................................................11
SASS Indented Syntax ....................................................................................................................................11
Syntax Differences of SASS ............................................................................................................................12
Multiline Selectors.........................................................................................................................................12
Comments .....................................................................................................................................................14
@import ........................................................................................................................................................14
Mixin Directives.............................................................................................................................................14
Deprecated Syntax ........................................................................................................................................14
4. Using SASS ..............................................................................................................................................16
Rack/Rails/Merb Plugin .................................................................................................................................16
Caching ..........................................................................................................................................................17
Options..........................................................................................................................................................17
Syntax Selection ............................................................................................................................................19
Encodings.......................................................................................................................................................19
5. SASS – CSS Extensions.............................................................................................................................20
SASS – Nested Rules......................................................................................................................................20
SASS – Referencing Parent Selectors.............................................................................................................23
SASS – Nested Properties..............................................................................................................................25
SASS – Placeholder Selectors.........................................................................................................................26
6. SASS – Comments...................................................................................................................................29
Sass – Interpolation in Multiline Comments .................................................................................................31
7. SASS – Script ...........................................................................................................................................33
SASS – Interactive Shell .................................................................................................................................34
SASS – Variables ............................................................................................................................................34
SASS – Data Types .........................................................................................................................................36
Strings............................................................................................................................................................36
Lists................................................................................................................................................................38
Maps..............................................................................................................................................................39
Colors.............................................................................................................................................................39
SASS – Operations .........................................................................................................................................39
SASS – Number Operations...........................................................................................................................40
SASS
iii
SASS – Color Operations................................................................................................................................42
SASS – String Operations...............................................................................................................................44
SASS – Boolean Operations ...........................................................................................................................45
SASS – Parentheses .......................................................................................................................................47
SASS – Functions............................................................................................................................................49
SASS – Interpolation ......................................................................................................................................51
SASS – & in SassScript....................................................................................................................................52
SASS – Variable Defaults................................................................................................................................54
8. SASS – @-Rules and Directives................................................................................................................57
Sass – Import Directives ................................................................................................................................57
Sass – Media Directives.................................................................................................................................61
Sass – Extend Directives................................................................................................................................63
Sass – At-root Directives................................................................................................................................66
Sass – Debug Directives.................................................................................................................................69
Sass – Warn Directives ..................................................................................................................................70
Sass – Error Directives...................................................................................................................................71
9. SASS – Control Directives & Expressions .................................................................................................73
SASS – if() Function........................................................................................................................................73
SASS – @if Directive ......................................................................................................................................75
SASS – @if Directive ......................................................................................................................................75
SASS – @else if Directive ...............................................................................................................................77
SASS – @for Directive....................................................................................................................................79
SASS – through Keyword ...............................................................................................................................79
SASS – to Keyword.........................................................................................................................................81
SASS – @each Directive.................................................................................................................................83
SASS – @each Directive.................................................................................................................................84
SASS – @each Multiple Assignment..............................................................................................................86
SASS – @each Multiple Assignment with Maps............................................................................................88
SASS – @while Directive................................................................................................................................90
10. SASS – Mixin Directives...........................................................................................................................92
Sass – Defining a Mixin ..................................................................................................................................92
Sass – Including a Mixin.................................................................................................................................94
Sass – Mixin Arguments.................................................................................................................................96
Sass – Passing Content Blocks to a Mixin ......................................................................................................99
11. SASS – Function Directives....................................................................................................................102
Naming Conventions ...................................................................................................................................103
12. SASS – Output Style ..............................................................................................................................104
:nested.........................................................................................................................................................104
:expanded....................................................................................................................................................104
:compact......................................................................................................................................................105
:compressed ................................................................................................................................................105
13. Extending SASS .....................................................................................................................................106
Defining Custom SASS Functions.................................................................................................................106
Cache Stores................................................................................................................................................106
Custom Importers.................... . المزيد..