Hello, in this CSS Crash Course video, we're going to be looking at attribute selectors. So what is an attribute selector? Well, in your CSS, we selected elements using stuff like Dave, you've done it using stuff like hash something which would refer to a deer with a certain unique ID or dot, which refers to a particular class. And you'll put the name afterwards, what you can do is target a particular element that has a certain attribute. Let me demonstrate that if I go to my index for zoom in, and I'm going to put a few elements here, I'm gonna put input. I'm gonna put type of text and I'm also going to put another input, which is going to be a type of submit basically button for a div and this div is simply going to have an attribute called some thing.
This is an attribute. This is also an attribute and this attribute is assigned text and submit. It does not have to be assigned something inside here, hello. Another div not going to have any attribute class or ID. We'll save that. Go to the website refresh.
This is what we get. We go to index dot CSS for now. What we can actually do is select it using the attribute selectors. So let me zoom in. And we're going to put input the square brackets type equals text. Now fee, I think you can guess what this does.
It target every input that you Have type text of the Submit will not be affected by proper background color as red, save that, go back refresh. As you can see, this is red, but this isn't. So if we have multiple text items, instead of adding classes, if you know your small all your text inputs to be read, or you want them to be of a certain size or have this particular CSS property, then you can just do it like this. And now, let me just show you how to do it. If the actual attribute doesn't have something assigned to it, it's very simple. You put the element name, then you put a square bracket, you simply put the attribute that is it in here, but font size equals three em, save that go back refresh.
As you can see, this has changed size but this hasn't. So that's it. This is just been a quick video on it. attribute selectors in CSS. If you have any questions, feel free to post them on my education platform, sonar learning.co.uk or contact us messages by platform, contact us via Twitter however you feel comfortable. Plus there will be a resource link to all of the fourth code from this video and every other video in this series.
And as usual, thank you for watching and I hope you have a great day.