‫Hey, there.
‫Welcome back.
‫Now in this lecture, let us design some banner.
‫So I just took this day randomly.
‫I'm going to call a class name and call.
‫This has a banner.
‫And inside this, I'm going to add one.
‫And let's just say hello, boys.
‫And then inside this, I'm going to add a block on this room, maybe 50.
‫That's it.
‫Or I can take five 10, but this is this is done.
‫So this is just sample content.
‫Now here I'm going to get inside my div.
‫On, I should say I do with the colossal banner.
‫And then had I'm going to add some background color as well as align my decks towards the center.
‫So first, let me jump onto this gradient, Ioannidis gradient or dial, select this background color,
‫jump on to see save this background color and that should work fine.
‫So this is some content right now, we have this content on we have this content, that tech.
‫But what if I want to have this web design on?
‫Are there?
‫What we can do?
‫So what you can do is you can turn them wisely.
‫I hope you got the IRA, this blue part is going to be visible, and then this white part will be the
‫background color, actually, so you can turn them as you want and you can copy them with the help of
‫this button.
‫So let me select this part and which we are going to have this whole wide thing like this and looting
‫will cover our own space.
‫Click here.
‫Copy that as we record.
‫Jump on to our Dave on here.
‫We can add after rugby that if I can save this one.
‫And you will see some type of design here.
‫OK.
‫This is blue right now.
‫So what I'm going to do is I'm going to change the fill color and I'm going to get it in the form of
‫white.
‫Save this one.
‫Get back here now you can see we have some type of design here.
‫You have to remember this that we are copying this part and then changing the color from blue to white.
‫Remember this if I choose white here, it will be a bit confusing.
‫So I just selected blue and then I'm going to recycle them or change the color.
‫Now this is the part that we are copying.
‫You can try a different shape, maybe in the form of like buildings, maybe some other design, or maybe
‫the web part, or you can change them multiple times.
‫Maybe this one for now.
‫And let me copy this one, copy this code, get back here.
‫You place my sweetie, save this one and change the color again.
‫So let me go where the white save this one, get back again.
‫So this is the part that we are correcting.
‫Now remember if I right click here.
‫So this is the part that we are currently working with and we can change anything.
‫Whatever we want, we can control things.
‫The first thing I'm going to do is I'm going to change this SPG into block one.
‫So I'm just going to select the 3D and going to see display block.
‫Save this one.
‫Now you can see it is not covering this piece.
‫So this is how we are designing some type of shape.
‫Now you can do something similar on the top, like you did here, so we can define different type of
‫shape.
‫And when you are copying for the top, just replace it.
‫OK.
‫So let me try to take some good shape.
‫OK, let me try to copy this one and remember, you can always draw any type of shape here, so let
‫me copy this one and get back here.
‫And this is going to be on water.
‫I'm going to have a white color.
‫Save this one and something in the reverse park.
‫I will have bought it up.
‫So just change the reverse part.
‫Copy.
‫And get a little.
‫And again, charity cannot provide.
‫Save this one.
‫Get back here.
‫OK, so that's how our current banner is looking.
‫Now remember inside our there we added to as we define it, this is Dave.
‫This is a big one.
‫And then we have our H1 B dog and then as we do too.
‫So that's how we are currently designing.
‫You can control a lot of things.
‫I just took a basic example that how you can draw things that are multiple type off shape that you can
‫opt for.
‫But remember one thing there are chances that you will get maybe some type of species or some type of
‫background here.
‫So you're going to win them by converting your vision to the block form.
‫And then you can also change the words height with the respective size here.
‫So we have this view block now.
‫Other thing is you can change that varsity whatever you want.
‫You can utilize multiple languages.
‫And remember one thing that we are trying to capture only this part of this shape.
‫So whatever be visible blue, here we are adding.
‫So at this point of time, we captured this blue added at the top.
‫And then in the reverse part, we captured this blue and added here.
‫So only the blue part is taking space, the white part will be covered by the color, so currently we
‫are utilizing our gradient color.
‫That is why we have this design.
‫Now you can change the font, size, color, whatever you want, but the aim is to understand how to
‫design stuff with the help of 3D.
‫Now, one model you can utilize is Bob Maker, not app.
‫And then you can change different type of shape here.
‫You can see whatever the shape that you want.
‫Again, you can do this similar process.
‫You can download or copy the code and add it with your HDMI by.
‫Similarly, this same divide that is also going to work fine, I have to criticize her, and that means
‫I'm zoomed out so I can show you the complete website, so there are few more things that you can do.
‫There are multiple options.
‫Maybe you want this part, or maybe you want triangle.
‫Maybe you want this.
‫There are the friendship that can be done, and that's how this whole thing is going to look.
‫And you have full information how this is going to work because of this information, that how this
‫is moving.
‫What is this al doing?
‫How this line is drawn?
‫So you have this information?
‫Now, all of this is good, but if you realize at the time of download, they are giving you option
‫to download speed you directly.
‫Also, if you try to download any type of logo online, maybe for any big company, they give you option
‫to download them in the form of a you directly how we can do that with our own images.
‫I don't want to utilize discord.
‫I want to utilize image directly.
‫So what you can do is you can copy this code or shortcut this code from here and here.
‫Let me try to create a new file.
‫Maybe call this as big one.
‫Not as with.
‫Remember the extension as we do, and I'm going to utilize the sample name when it is on here.
‫You can paste this code and now you can utilize the image directly that I saw in my source code.
‫And you can use BJU one dot sweetie, since currently they are in this same folder.
‫And if I get back here, you can see this is still working now that our chances that you might see some
‫hair and their values.
‫So what you can do is you can also convert this whole image you tag into a blog because this am in nine
‫function.
‫So you can see for this specific, you can give a class or you can say maybe not banner EMG.
‫And here you can go display as blog.
‫Save this one.
‫And this looks fine to me, but you can also do this here and there with the help of these values so
‫that if I go ahead, maybe 35, save this one and get back here.
‫OK?
‫You can see there is some small part here.
‫Some small part hair doctors weighs about.
‫You can read these values to have other information.
‫So I hope you got the idea, how do you realize you're a sweetie in the form of image?
‫Now I'm going back with my -- with you for now.
‫Let me delete this one, so I'm going to delete this because you are not a sweetie.
‫Save the Swan, get back here.
‫This is visible.
‫Now one important thing.
‫Let me try to inspect, see if this is a response to.
‫Yes.
‫As responsive.
‫Yeah.
‫The thing is, if I try to zoom, you can see every part of assuages response.
‫So you don't have to worry much.
‫That's all for this lecture.
‫I hope you got the idea how to utilize, as we understand about their part, understand about different
‫tools that you utilize and how to draw these type of banner.
‫Thank you for.
‫I hope this lecture was helpful and I see you guys in the next one.