Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the tutormate domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /var/www/dawrat.droosplus.com/wp-includes/functions.php on line 6131
28 – Mastering The CSS Calculation – دورات
محتوى الدورة
Elements And Naming
0/5
01 – Introduction And What I Need To Learn
08:22
02 – Your First Project And Syntax
08:41
03 – Element Styling
06:25
04 – Name Conventions And Rules
08:02
حلول تكليفات CSS الدروس من 01 إلى 04
14:03
Background, Margin, Padding
0/5
05 – Background – Color, Image, Repeat
07:55
06 – Background – Attachment, Position, Size
08:09
07 – Padding
09:02
08 – Margin
08:16
حلول تكليفات CSS الدروس من 05 إلى 08
13:14
Border, Outline, Display
0/5
09 – Border
05:57
10 – Outline
06:39
11 – Display – Block, Inline Block, Inline
11:54
12 – Element Visibility And Use Cases
05:14
حلول تكليفات CSS الدروس من 09 إلى 12
09:33
Nesting, Dimensions, Overflow
0/5
13 – Grouping Multiple Selectors
05:56
14 – Nesting
05:18
15 – Dimensions – Width And Height
08:13
16 – Overflow – Overflow-X And Overflow-Y
04:52
حلول تكليفات CSS الدروس من 13 إلى 16
07:37
Text Formatting
0/6
17 – Text – Color And Shadow
03:52
Lesson18 – Text – Alignment
04:47
19 – Text – Decoration And Transform
04:05
20 – Text – Spacing
10:04
21 – Text – Overflow And Use Cases
04:08
حلول تكليفات CSS الدروس من 17 إلى 21
14:44
Inheritance, Typography
0/6
22 – Inheritance in css
05:35
23 – Typography – Font Family
10:47
24 – Typography – Font Size And CSS Units
09:13
25 – Typography – Font Style And Variant And Weight
04:46
26 – Mouse Cursor
04:15
حلول تكليفات CSS الدروس من 22 إلى 26
09:38
Float, Opacity
0/4
27 – Float And Clear
09:03
28 – Mastering The CSS Calculation
08:54
29 – Opacity
03:12
حلول تكليفات CSS الدروس من 27 إلى 29
12:37
Position, List, Table
0/5
30 – Position
11:07
31 – Z-Index
06:50
32 – Lists Styling
07:14
33 – Table Styling
07:35
حلول تكليفات CSS الدروس من 30 إلى 33
28:35
Pseudo Classes, Pseudo Elements
0/5
34 – Pseudo Classes
11:28
35 – Pseudo Elements – First Letter, First Line, Selection
06:49
36 – Pseudo Elements – Before, After, Content
11:07
37 – Pseudo Elements – Content And Trainings
09:18
حلول تكليفات CSS الدروس من 34 إلى 37
15:11
Border Radius, Box Shadow
0/5
38 – Vendor Prefixes
09:09
39 – Border Radius
06:11
40 – Box Shadow And Examples
07:14
41 – The Box Model And Box Sizing
07:20
حلول تكليفات CSS الدروس من 38 إلى 41
21:44
Transitions, Variables
0/5
42 – Transition
13:28
43 – !Important Declaration And Use Cases
05:23
44 – The Margin Collapse
07:50
45 – CSS Variables And Trainings
08:34
حلول تكليفات CSS الدروس من 42 إلى 45
14:08
Flex Box
0/9
46 – Flex Box Parent – Direction, Wrap, Flow
09:22
47 – Flex Box Parent – Justify Content
10:37
48 – Flex Box Parent – Align Items
04:56
49 – Flex Box Parent – Align Content
05:33
50 – Flex Box Child – Grow, Shrink, Order
06:56
51 – Flex Box Child – Flex Basis, Flex Shorthand
08:58
52 – Flex Box Child – Align Self, Games, Task
03:23
53 – Finish Flex Froggy Game
11:35
حلول تكليفات CSS الدروس من 46 إلى 53
31:18
Filters, Gradient
0/4
54 – Filters
03:56
55 – Gradients
12:22
56 – Pointer Events And Caret Color
04:40
حلول تكليفات CSS الدروس من 54 إلى 56
11:54
Grid
0/10
57 – Grid – Parent – Template Columns
11:33
58 – Grid – Parent – Template Rows And Gap
07:54
59 – Grid – Parent – Justify Content And Align Content
04:39
60 – Grid – Parent – Complete Layout With Template Areas
11:52
61 – Grid – Child – Grid Column And Grid Row
07:24
62 – Grid – Child – Grid Area And Trainings
06:36
63 – Grid – Min, Max And Auto Fill
07:48
64 – Finish The Grid Garden Game
17:41
حلول تكليفات CSS الدروس من 57 إلى 64 الجزء الأول
30:22
حلول تكليفات CSS الدروس من 57 إلى 64 الجزء الثاني
18:18
Scale, Rotate, Translate
0/4
65 – 2D Transform – Scale
04:55
66 – 2D Transform – Rotate
07:11
67 – 2D Transform – Translate
05:18
حلول تكليفات CSS الدروس من 65 إلى 67
13:59
Skew, Matrix, 3D Transform
0/7
68 – 2D Transform – Skew
05:01
69 – 2D Transform – Matrix
07:16
70 – Transform – Origin
08:29
71 – 3D Transform – Rotate
06:12
72 – 3D Transform – Translate, Perspective, Perspective Origin
04:48
73 – 3D Transform – Backface Visibility And Flip Product
09:17
حلول تكليفات CSS الدروس من 68 إلى 73
26:14
Animation
0/6
74 – Animation – KeyFrames, Name, Duration
06:56
75 – Animation – Iteration Count, Timing Function, Spinner Loading
04:28
76 – Animation – Direction, Fill Mode, Play State, Delay
11:04
77 – Up And Down Loading Animation Training
06:02
حلول تكليفات CSS الدروس من 74 إلى 77 الجزء الأول
21:54
حلول تكليفات CSS الدروس من 74 إلى 77 الجزء الثاني
29:49
Selectors
0/6
78 – CSS Selectors Reference Part 1
09:28
79 – CSS Selectors Reference Part 2
09:17
80 – CSS Selectors Reference Part 3
10:13
81 – CSS Selectors Reference Part 4
09:14
82 – CSS Selectors Reference Part 5
07:57
حلول تكليفات CSS الدروس من 78 إلى 82
23:23
Media Queries
0/4
83 – Media Queries And Responsive Designs Intro
09:02
84 – Media Queries And Responsive Designs Standards
11:31
85 – Media Queries And Responsive Designs Practice
11:44
حلول تكليفات CSS الدروس من 83 إلى 85
19:41
Global Values
0/4
86 – Create Your Framework
10:00
87 – CSS Global Values
10:43
88 – The End And How To Master HTML And CSS
06:46
حلول تكليفات CSS الدروس من 86 إلى 88
15:26
ملخصات للدورة وأكواد لحلول التكليفات
0/2
ملخصات دورة CSS للزيرو ويب سكول
أكواد حلول تكليفات CSS للزيرو ويب سكول – Elzero web School
Learn CSS In Arabic 2021
وصف الدرس

ال Code الموجود في الدرس

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>CSS</title>
    <link rel="stylesheet" href="css/master.css" />
  </head>
  <body>
    <div>Product One</div>
    <div>Product Two</div>
    <div>Product Three</div>
    <div>Product Four</div>
  </body>
</html>
body {
  margin: 0;
}
div {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  background-color: #eee;
  float: left;
  width: calc((100% - 60px) / 5);
  margin-left: 10px;
}
/*
  Content Width Is: 100%
  6 Spaces  10px * 6 => 60px From Content Width
  100% - 60px Available Space
  5 Elements The Width Is: (100% - 60px) / 5
*/
السابق
التالى

دورات

موقع يقدّم محتوىً تعليميًا شاملًا ومتنوّعًا في مختلف المجالات، يمكنك من خلاله تنمية مهاراتك ومعرفتك في مجالاتٍ متعددة، والوصول إلى فرص جديدة في حياتك المهنية والأكاديمية.