1
00:00:00,360 --> 00:00:06,630
Hello, friend will come back in a previous video, we successfully display our home, that means in

2
00:00:06,630 --> 00:00:10,140
our home base area we successfully display our everything.

3
00:00:10,140 --> 00:00:11,670
That means our product name.

4
00:00:11,670 --> 00:00:15,960
We display our product a price and the all price and the product image.

5
00:00:16,290 --> 00:00:18,740
And also here, a defense of the class.

6
00:00:18,750 --> 00:00:19,070
Right.

7
00:00:19,080 --> 00:00:22,130
So now we have to do we have to create our this all that C as this class.

8
00:00:22,500 --> 00:00:28,410
So if you want to create it, I already define of our business email that is our stylesheet before that

9
00:00:28,410 --> 00:00:28,690
head.

10
00:00:29,040 --> 00:00:33,800
So here I want to do want to create every class in particular that area for doing this.

11
00:00:33,810 --> 00:00:38,940
First of all, I define the class as a card, OK, just simply define the class as a card so far.

12
00:00:38,940 --> 00:00:43,430
And as I told you, if you already knew about that Xerces, then it should be very much clear to you.

13
00:00:43,440 --> 00:00:49,220
So here I define the height, OK, just simply the height as a 350 pixel.

14
00:00:50,010 --> 00:00:51,750
And also after that.

15
00:00:52,200 --> 00:00:56,750
After that, I want to do want to create another class for this card, OK?

16
00:00:56,820 --> 00:00:59,790
For this card we have to do we have to define another class.

17
00:01:00,210 --> 00:01:10,140
So I just simply the card so that the card and here I define what the card and the regular card and

18
00:01:10,140 --> 00:01:12,000
also I have defined that card for that.

19
00:01:12,000 --> 00:01:12,240
Right.

20
00:01:12,630 --> 00:01:14,380
So now we have to do we have to create it.

21
00:01:14,400 --> 00:01:20,250
So after that I define as a card product and for the card product, what exactly should we do after

22
00:01:20,250 --> 00:01:20,530
that?

23
00:01:20,550 --> 00:01:24,180
So here I define as after that means after.

24
00:01:24,720 --> 00:01:28,140
So the card product after I'm done with the class.

25
00:01:28,650 --> 00:01:31,540
OK, so here that will be one.

26
00:01:32,250 --> 00:01:34,680
So here we have to define all the content.

27
00:01:35,730 --> 00:01:42,020
Content will be as empty and then I define the display and display.

28
00:01:42,020 --> 00:01:49,210
It will be as a table and then our clear look at clear will be as a board.

29
00:01:50,130 --> 00:01:53,110
So as I told you, everything is cassus class.

30
00:01:53,140 --> 00:01:54,870
So now I also define the visibility.

31
00:01:55,720 --> 00:01:56,980
Visibility, OK?

32
00:01:57,000 --> 00:01:58,520
Visibility will be as a hidden.

33
00:01:59,760 --> 00:02:02,700
So visibility will be as a hidden perfect.

34
00:02:02,720 --> 00:02:04,730
So that is our class.

35
00:02:04,740 --> 00:02:06,740
And after that I want to undertake another one.

36
00:02:06,750 --> 00:02:18,220
It will be as a card, that card and then product and then product and card product and then within

37
00:02:18,240 --> 00:02:20,900
price, new price new.

38
00:02:21,510 --> 00:02:29,790
And also I want to take another one as a card and then product and then our price.

39
00:02:31,510 --> 00:02:36,870
So in particular, that area here I defined as a margin, I just simply defined as the margin.

40
00:02:36,870 --> 00:02:39,210
Right, as a five pixel.

41
00:02:39,300 --> 00:02:42,410
OK, so just simply defined as a five pixel.

42
00:02:42,690 --> 00:02:45,780
And after that we have to also define our old price.

43
00:02:45,780 --> 00:02:51,690
So for the old price, I have defined the card God and the product.

44
00:02:53,790 --> 00:03:03,350
So here I define as a product and then our price, old price all for this one I want to do under a different

45
00:03:03,390 --> 00:03:03,940
color.

46
00:03:04,560 --> 00:03:11,820
I just said on the color as a C.C.C., ok are better able to defend as a nine nine then it will be better

47
00:03:11,820 --> 00:03:12,270
actually.

48
00:03:12,300 --> 00:03:15,390
And after that also I want to undertake another one.

49
00:03:15,420 --> 00:03:24,900
I take another one at the card and the product of a card product with the images in the images here

50
00:03:24,900 --> 00:03:28,950
I have defined as image on.

51
00:03:29,100 --> 00:03:36,310
OK, so I just simply defined as the image Zamp and with this and here I want to define the image borders

52
00:03:36,310 --> 00:03:37,730
also just simply defined the border.

53
00:03:37,740 --> 00:03:39,830
Don't look at border areas.

54
00:03:39,840 --> 00:03:47,820
Border radius will be as a three pixel and then the three pixel and then also make that as a zero zero.

55
00:03:47,940 --> 00:03:50,090
OK, so this will be a zero zero.

56
00:03:50,550 --> 00:03:53,980
That means there will be the round and also of our flow will be needed.

57
00:03:54,000 --> 00:03:55,950
So this is our workflow hidden.

58
00:03:57,360 --> 00:03:57,800
Sorry.

59
00:03:59,910 --> 00:04:03,510
So I will be as a hidden and then the position.

60
00:04:05,370 --> 00:04:10,890
So I define the position as the relative and also high definition of the height.

61
00:04:12,490 --> 00:04:19,240
OK, I just have to wonder how it will be the two two zero four right now and two to two big Zol and

62
00:04:19,300 --> 00:04:22,060
so friend, I don't I'm actually defining everything so little.

63
00:04:22,060 --> 00:04:24,780
If we want to change it, then we can actually change it.

64
00:04:25,180 --> 00:04:31,740
So here I want to defend on the tax line like a tax line and for the tax alone would still be at the

65
00:04:31,750 --> 00:04:32,500
center tax.

66
00:04:33,190 --> 00:04:40,000
And also after this, I want to do a look at some of the middle class so here after this and really

67
00:04:40,000 --> 00:04:43,900
find out that class has a card with this card product.

68
00:04:44,740 --> 00:04:45,910
With this card product.

69
00:04:45,910 --> 00:04:47,470
I refund for the emails.

70
00:04:47,650 --> 00:04:48,270
May Zamp.

71
00:04:48,790 --> 00:04:51,160
OK, Masab Mays.

72
00:04:51,160 --> 00:05:00,250
And here, maximum maximum white I define as 100 percent say there's no difference 100 percent and also

73
00:05:00,250 --> 00:05:01,960
under defined as the maximum height.

74
00:05:02,680 --> 00:05:06,260
So maximum height will be also as a hundred percent.

75
00:05:07,520 --> 00:05:12,850
OK, and then also here I want to do under the front of the object feet.

76
00:05:14,290 --> 00:05:20,500
So object feet will be as a cover conversive friend I will share total projects.

77
00:05:20,500 --> 00:05:21,350
Hausfeld with you.

78
00:05:21,370 --> 00:05:24,560
So if you don't want to write this code then you can ignore it.

79
00:05:24,970 --> 00:05:28,620
So right now I'm actually doing the most common things.

80
00:05:28,640 --> 00:05:32,770
What exactly they need it for, in particular our this project.

81
00:05:33,160 --> 00:05:42,360
So I just simply give another on the card and then product like cardboard that will be in our info maybe.

82
00:05:42,370 --> 00:05:44,590
Yeah, that is information I want to do.

83
00:05:44,600 --> 00:05:46,110
I also want to defining it.

84
00:05:46,120 --> 00:05:54,310
So here I want to define another one which will be as a workflow, as a hidden and then the painting.

85
00:05:54,640 --> 00:06:03,560
I define some of the padding for this one and padding I define as a 15 pixel and then the border, OK,

86
00:06:03,670 --> 00:06:10,840
defines the border top, the border top and for the border top, which will be the one pixel and then

87
00:06:10,840 --> 00:06:14,700
solid look for one pixel solid.

88
00:06:14,710 --> 00:06:19,030
And also I make that as easy type of one of the color I want to put.

89
00:06:19,660 --> 00:06:24,450
And then also I the front that actions that we say in our competition.

90
00:06:25,030 --> 00:06:32,470
So here I just simply defined the card and the card product and the product area.

91
00:06:32,530 --> 00:06:34,150
Sorry, dot action.

92
00:06:34,840 --> 00:06:36,970
Dot action here at the front of the Walmart.

93
00:06:39,240 --> 00:06:48,000
So with this here, I want to do want define another another building top side in front of the building,

94
00:06:48,000 --> 00:06:55,800
top building top will be as a four pixel, defined as a four piece right now and also at the front of

95
00:06:55,830 --> 00:06:56,590
the margin.

96
00:06:57,960 --> 00:07:06,900
So here at the front of the magazine top so marzin top will be as a four pixel and also to the end to

97
00:07:06,900 --> 00:07:13,640
create another class card, product scarred product.

98
00:07:13,650 --> 00:07:17,810
And then this one for our bottom whomped.

99
00:07:19,350 --> 00:07:25,590
And here I want to do under the front of the building building will be as a 15 pixel.

100
00:07:26,430 --> 00:07:29,530
OK, and also here, I defend that border.

101
00:07:30,450 --> 00:07:32,610
So that is a border border.

102
00:07:32,640 --> 00:07:34,730
Torpy defined as one big zone.

103
00:07:35,640 --> 00:07:37,560
OK, one pixel solid.

104
00:07:38,760 --> 00:07:43,020
And also here it puts on the color so better defined easy.

105
00:07:43,100 --> 00:07:50,790
OK, so this color and also our last one, I want to define how to define another one as a card and

106
00:07:50,790 --> 00:07:54,680
then card with our Product Support Act.

107
00:07:54,710 --> 00:07:59,280
And then also here I have defined.

108
00:08:01,550 --> 00:08:08,570
I have to find that product that is a name that is a title of it I want to do and define the title so

109
00:08:08,570 --> 00:08:12,740
that your product title here defines the magazine.

110
00:08:13,280 --> 00:08:16,610
Top and top will be as originally defined as zero.

111
00:08:16,860 --> 00:08:19,610
So little if you need, we will update it.

112
00:08:19,850 --> 00:08:21,820
So here, that's also here.

113
00:08:21,820 --> 00:08:27,680
Right now I'm actually adding some old Cyesis class, which I have already tasted so far this very much.

114
00:08:27,680 --> 00:08:28,460
Come on, actually.

115
00:08:28,460 --> 00:08:28,910
Come on.

116
00:08:28,910 --> 00:08:30,940
All the cases I have used on here.

117
00:08:30,950 --> 00:08:36,170
So if you have already some idea about the success, then everything is very much going on.

118
00:08:36,550 --> 00:08:41,900
OK, so here I am not focusing to create some specific Gorgias design.

119
00:08:42,200 --> 00:08:45,020
So the simple design, I want to actually define that part.

120
00:08:45,020 --> 00:08:47,180
OK, so that's all avant garde.

121
00:08:47,510 --> 00:08:48,890
Now let's check this out here.

122
00:08:48,900 --> 00:08:54,470
I just click to save all and here I have already defined all the titles, so now we will actually match

123
00:08:54,470 --> 00:08:54,740
it.

124
00:08:54,860 --> 00:08:56,150
Now if you refresh it.

125
00:08:57,120 --> 00:09:02,910
Yeah, you can see a little bit good, so here I have defined some of the border for this product and

126
00:09:02,910 --> 00:09:06,290
also showing our title, our prize and our all prize.

127
00:09:06,570 --> 00:09:10,150
So here I want to do want to make that our TESOL price is full.

128
00:09:10,170 --> 00:09:11,880
Price will be like here.

129
00:09:11,890 --> 00:09:13,640
But I want to add one of this strike.

130
00:09:14,280 --> 00:09:17,130
So if you want to use that strike that is in our home.

131
00:09:17,280 --> 00:09:19,590
Jemal So that is our price.

132
00:09:19,830 --> 00:09:22,430
So here at the front of this table, gold as a stake.

133
00:09:23,310 --> 00:09:25,500
So I just simply defended this strike.

134
00:09:25,500 --> 00:09:28,080
And also we have to do we have to finish it.

135
00:09:28,770 --> 00:09:32,700
So after this, after this, I just simply finish our stack.

136
00:09:33,090 --> 00:09:35,960
OK, so here I just simply finish it.

137
00:09:35,970 --> 00:09:37,460
Now, let's check this out.

138
00:09:37,470 --> 00:09:39,060
If we now get to save all.

139
00:09:39,990 --> 00:09:45,170
And now if you refresh it, yeah, because it's now become cross that busy state.

140
00:09:45,330 --> 00:09:49,200
So that was our previous price and that is our recent price, right.

141
00:09:49,590 --> 00:09:53,640
So here we successfully display our every product.

142
00:09:53,640 --> 00:09:56,880
And not only if you also want to lose it.

143
00:09:57,090 --> 00:09:57,460
Yeah.

144
00:09:57,480 --> 00:10:01,960
You can see it's not showing like that way was very interactive, very much responsive, actually.

145
00:10:01,980 --> 00:10:04,670
OK, so you can see that is actually very much responsive.

146
00:10:04,680 --> 00:10:06,690
So right now, 100 percent is OK with me.

147
00:10:07,140 --> 00:10:08,340
So no friend here.

148
00:10:08,340 --> 00:10:11,500
I'm going to do want to create one of the neighbor.

149
00:10:11,550 --> 00:10:14,250
OK, then that means this our phone, our home base.

150
00:10:14,700 --> 00:10:19,530
So there should be some of the are better able to do and to care of the neighbor in our header pushing

151
00:10:19,540 --> 00:10:24,330
earlier Sulkin created in our next video, I will show that things with the live example.

152
00:10:24,750 --> 00:10:28,080
So thanks for watching and I'll see you in the next video.