1 00:00:05,370 --> 00:00:10,860 Let's drill down the background functions provided by the CIA says. 2 00:00:13,190 --> 00:00:23,450 As you remember in style, Garcia says, we inserted Background White, which was released by a possible 3 00:00:23,450 --> 00:00:27,350 background color property set as white. 4 00:00:31,380 --> 00:00:40,770 And background image, which we decided to put aside with the following syntax. 5 00:00:42,340 --> 00:00:45,190 Inserting BG is Tazewell. 6 00:00:46,240 --> 00:00:57,010 Having to save and refresh to see the result, as you see, the Estancia logo will appear in the background 7 00:00:57,040 --> 00:01:01,810 being a one beside the other pattern to occupy all the page. 8 00:01:04,850 --> 00:01:07,340 In addition to color and image. 9 00:01:08,370 --> 00:01:15,600 Which, among the other things, can be inserted in only one condition, so only in the background, 10 00:01:15,870 --> 00:01:19,020 if we deleted this, you are Al. 11 00:01:20,050 --> 00:01:27,010 By cutting it with control or command X, so called into your operating system. 12 00:01:28,330 --> 00:01:34,720 And if we inserted insert here, deleting then image and also color. 13 00:01:36,760 --> 00:01:43,870 Therefore, leaving only background, the result, after saving and refreshing, would not change. 14 00:01:45,350 --> 00:01:53,840 It is evident that in this way, the immense badly affects and is sort of content inserted overate. 15 00:01:55,930 --> 00:02:05,200 So let's try and see how through all the functions of background, we can position the image into a 16 00:02:05,200 --> 00:02:12,660 determined space of the page through a simple indication inserted after the you. 17 00:02:12,880 --> 00:02:20,930 And we can choose where the image should appear, thanks to left, right, top and bottom. 18 00:02:21,580 --> 00:02:24,810 In this case, however, we can use center. 19 00:02:25,510 --> 00:02:31,870 So, for instance, we might insert our image as a line in the middle of the page. 20 00:02:35,560 --> 00:02:39,520 By using here the center and top functions. 21 00:02:41,120 --> 00:02:45,050 We should make the image appear the way we like. 22 00:02:46,600 --> 00:02:50,080 However, the base setting of our background. 23 00:02:52,040 --> 00:02:57,470 Produces a continuous repetition of the image in the screen or the browser. 24 00:03:00,370 --> 00:03:08,950 Therefore, by using only center and TARP, which we are seeing now by saving and refreshing, no modifications 25 00:03:08,950 --> 00:03:11,030 are brought to the background. 26 00:03:11,140 --> 00:03:14,590 There is one more function that ground provides. 27 00:03:15,990 --> 00:03:18,210 Which is the repeat function. 28 00:03:19,470 --> 00:03:27,150 Which will enable us to set whether to allow a repetition of an image or not within our background, 29 00:03:27,930 --> 00:03:36,780 given the fact we want to insert it into a specific position, we have to insert no repeat by saving 30 00:03:36,780 --> 00:03:44,320 and refreshing, we managed to obtain the image as a top center positioned within our background. 31 00:03:44,340 --> 00:03:50,370 Definitely this solution makes more sense than the repetitions we came across before. 32 00:03:53,270 --> 00:04:02,570 The capabilities of repeat enable us also to insert a repetition according to the positioning, as in 33 00:04:02,570 --> 00:04:09,570 this case it's sent to top, we have the opportunity to replicate it in a vertical way. 34 00:04:09,710 --> 00:04:20,810 Therefore, by adding dash y, which means y axis and so vertical, by saving and refreshing the browser, 35 00:04:20,810 --> 00:04:25,760 we contained our repeated image only as a center positioned. 36 00:04:27,930 --> 00:04:36,750 Instead, if we made a horizontal repetition, these center top would not be fully considered. 37 00:04:36,990 --> 00:04:46,260 It would be considered only as far as the top positioning because the repetition would go along the 38 00:04:46,260 --> 00:04:48,540 top line of our background. 39 00:04:49,520 --> 00:04:56,960 Therefore, as you see, our background has got a series of additional capabilities which permit us 40 00:04:56,960 --> 00:05:06,290 even to modify in various ways, also the image set as a background, the last peculiarity I would like 41 00:05:06,290 --> 00:05:15,920 to show you background is the opportunity to insert a background made up of more colors rendered as 42 00:05:15,920 --> 00:05:18,360 blending one into the other. 43 00:05:18,980 --> 00:05:25,790 You can also insert further colors which might make up the base of the page. 44 00:05:25,910 --> 00:05:28,610 Then let's delete everything be inserted. 45 00:05:29,900 --> 00:05:38,570 And let's just leave our background without any attribute, let's insert the linear gradient function, 46 00:05:38,570 --> 00:05:46,310 allowing us by inserting the colors and the specified angle or direction where we want to have the flow 47 00:05:46,310 --> 00:05:51,680 displayed to create a page with two or more colors. 48 00:05:53,270 --> 00:06:03,290 Let's start inserting a 90 degree angle or so cool direction, which gets inserted with numbers and 49 00:06:03,290 --> 00:06:13,040 the deck you reference divided by a comma, let's insert then green and white. 50 00:06:15,830 --> 00:06:23,750 Let's save refresh, and as you can see, our background starts green and fades to white. 51 00:06:26,200 --> 00:06:34,480 Whenever we decided to insert, for example, three colors by deleting our angle, we might choose to 52 00:06:34,480 --> 00:06:44,410 insert also red saving and refreshing to get simply a background which starts red transitions to green 53 00:06:44,410 --> 00:06:47,290 and then becomes white by degrees. 54 00:06:48,900 --> 00:06:59,070 Of course, among our different colourings to insert, we can also use the R, B or hexadecimal function 55 00:06:59,070 --> 00:07:00,840 to define the contours. 56 00:07:01,860 --> 00:07:10,020 Remember, though, that you cannot use linear gradient with other attributes and therefore you cannot 57 00:07:10,020 --> 00:07:14,490 insert an image alongside with this type of background.