1 00:00:05,410 --> 00:00:10,200 Something good you can do with the acreage you can modify existing copy that you have on your page and 2 00:00:10,200 --> 00:00:12,780 you can do that using the name with CSSA. 3 00:00:12,800 --> 00:00:15,490 And we're going to do is take a look at how you do that here. 4 00:00:15,750 --> 00:00:20,280 So what I've done so far is to have three basic paragraphs that we've used in previous videos and I've 5 00:00:20,280 --> 00:00:22,710 wrapped it with a container of ideas. 6 00:00:23,020 --> 00:00:29,260 So as of right now if I were to say that and go to My Documents here. 7 00:00:29,340 --> 00:00:29,540 All right. 8 00:00:29,550 --> 00:00:34,000 So I've just got three paragraphs of just basic black copy up and special on here. 9 00:00:34,320 --> 00:00:40,200 So what I want to do is within the document I want to create a style that I want to modify 10 00:00:42,720 --> 00:00:44,140 using a query. 11 00:00:44,460 --> 00:00:46,440 So it's Quenton call this. 12 00:00:46,650 --> 00:00:59,940 I don't know color box and we will create a stream of color to make it blue. 13 00:00:59,960 --> 00:01:01,160 I mean that can be code blue right there. 14 00:01:01,180 --> 00:01:01,440 OK. 15 00:01:01,440 --> 00:01:07,740 Call parts or say anything that gets this color box applied to it here. 16 00:01:07,860 --> 00:01:09,710 We are going to change the color to blue. 17 00:01:09,720 --> 00:01:13,770 Now it's not actually being targeted down here I don't have that class set up in any of these paragraph 18 00:01:13,770 --> 00:01:18,770 tags or within the ID here right now so it's not being applied just yet but we're going to use the query 19 00:01:18,780 --> 00:01:20,020 to do that for us. 20 00:01:20,280 --> 00:01:26,590 So up in here this is very simple an accretive function of using the dollar sign. 21 00:01:26,640 --> 00:01:27,420 We will say 22 00:01:30,480 --> 00:01:33,060 secret target or Id done here of container. 23 00:01:33,390 --> 00:01:35,010 So say cache 24 00:01:38,230 --> 00:01:44,080 container and going to target the paragraph tag within there and we're going to use a new function called 25 00:01:44,110 --> 00:01:50,120 Raft and it's going to wrap itself whatever it is around the container paragraph tag here. 26 00:01:50,140 --> 00:01:57,310 It's just a write up and then open and close friends and we will say with quotation marks or start to 27 00:01:57,310 --> 00:02:06,450 type out some CSSA and say read it raptus with a DIV tag ID is actually a class equals. 28 00:02:06,730 --> 00:02:10,120 And when you use single quotes here because we're already kind of wrapped in double quotes with you 29 00:02:10,120 --> 00:02:17,340 single quotes this time otherwise it closes that out or say seven I named it in a colored box. 30 00:02:17,470 --> 00:02:21,250 Terence So now I just need to close out that. 31 00:02:21,400 --> 00:02:24,470 That's close it out with a semi-colon right there. 32 00:02:24,550 --> 00:02:25,310 And when should do. 33 00:02:25,330 --> 00:02:29,860 Again taking it all the paragraph tags within the container here it should wrap them with is declasse 34 00:02:29,860 --> 00:02:33,430 of color box changing my font to this cool blue color. 35 00:02:33,640 --> 00:02:38,230 Amice save that and come back to my document and just hit refresh and you can see that it went ahead 36 00:02:38,230 --> 00:02:41,080 and modified all that copy right up in there. 37 00:02:41,140 --> 00:02:45,460 So what you can also do is you can 38 00:02:48,650 --> 00:02:58,360 now target specific paragraphs with and here I would say first and we could use Refresh there and I'm 39 00:02:58,370 --> 00:03:01,600 just targeting just the first one to modify that. 40 00:03:01,640 --> 00:03:04,330 You could also do a different function here. 41 00:03:04,400 --> 00:03:09,890 See we can do MT and keep an open and close print right there. 42 00:03:11,640 --> 00:03:17,410 You too many closing print 3:36 close out of that on course to save that. 43 00:03:17,420 --> 00:03:21,080 And now just the first paragraph should come up empty. 44 00:03:21,230 --> 00:03:25,520 So I hit refresh you can see the last number one notch step two and three right there. 45 00:03:25,530 --> 00:03:25,850 Good. 46 00:03:25,850 --> 00:03:29,660 Good way to kind of clear out just one paragraph for you know a specific area. 47 00:03:29,840 --> 00:03:33,890 This can be for testing this could be for maybe just some mobile devices that will turn off certain 48 00:03:33,910 --> 00:03:40,440 paragraph's things like that can be useful for so another one that you can do is run out of five is 49 00:03:40,450 --> 00:03:45,820 just like they kind of almost like write it in reverse from what we had just a minute ago here still 50 00:03:45,820 --> 00:03:46,420 starting out with. 51 00:03:46,450 --> 00:03:49,820 That's going to move us. 52 00:03:49,840 --> 00:03:54,520 Keep those quote marks there but we can say Divx 53 00:04:03,110 --> 00:04:09,170 we can say we can't replace this with the word container in here and we're going to do is we are going 54 00:04:09,170 --> 00:04:20,050 to replace all of anything with it in the ID home 55 00:04:22,950 --> 00:04:23,450 container. 56 00:04:23,480 --> 00:04:25,970 And here are my clothes out. 57 00:04:26,200 --> 00:04:32,880 So basically saying this will be replaced all of within the container. 58 00:04:32,950 --> 00:04:39,480 So save that come back over here and you can see my paragraphs had been replaced with just a DIV tag. 59 00:04:39,870 --> 00:04:45,950 I inspect it you can see here it's been replaced which is a DIV tag of container. 60 00:04:46,510 --> 00:04:51,370 Well that's why I'm Take a look at here is when curved versus a hat here we can just remove the last 61 00:04:52,400 --> 00:04:55,950 place in there and switch this one around here. 62 00:04:56,430 --> 00:04:56,760 Sorry. 63 00:04:56,770 --> 00:04:58,630 Say the container. 64 00:04:58,770 --> 00:05:03,500 We want to replace with a different function. 65 00:05:03,500 --> 00:05:08,470 Replace all with replace with an and we will say. 66 00:05:09,140 --> 00:05:14,670 Try to put in the wrong spot there between the quotes there and trying to place with you know how you 67 00:05:14,720 --> 00:05:22,690 write something different. 68 00:05:22,760 --> 00:05:24,930 This has been replaced with anything with them to continue. 69 00:05:24,930 --> 00:05:27,430 They are replace it with this div tag here. 70 00:05:27,470 --> 00:05:35,180 We can save it come back and refresh and you can see that this has been replaced with because of the 71 00:05:35,180 --> 00:05:36,730 inspector there. 72 00:05:36,860 --> 00:05:41,400 So this can be very useful for again all different things maybe switching things out on mobile devices. 73 00:05:41,510 --> 00:05:44,710 Certain tasks it can be used for testing purposes. 74 00:05:44,930 --> 00:05:49,120 All the other reasons but a lot of cool powerful things you can do with this GR.-RE function.