How to select an element in CSS if we don't know its Class or Identifier

Hi guys, how are you?

In this video we are going to see how we can modify the style, the design of any form or any other element of our web page if we do not have an identifier and a class.

We are going to see how to do it by css if we are missing these elements, the class or the identifier.

It is something that a student has asked me and we are going to see how it could be done, it seems very interesting to me and that is why I wanted to show you that it is done in a very simple way, also to do it we are going to use the help and in this case we are going to see that apart from the identifiers and the classes we can make calls through the attributes.

So thanks to this we can do it, don't be scared of everything you see here because we are going to do it in a very simple way, in this case I am going to modify this tag, in the name tag but I don't want the email tag to be modified so if i right click, inspect i can see the source code in chrome.

In this case, if you realize this label does have a class but I am not going to use it, imagine that it did not have this class, it is very simple, in fact, if I selected it and here I click on more it will generate a rule already with the class written but in this case I am going to delete the class because I am going to imagine that it did not exist, so thanks to the attribute, in this case, FOR which is the attribute that we have here.

If we realize the attribute has the value of input_2_8, if I select the email tag, for example, we see that it is input_2_2, that is, each of these tags has a different value, so I can modify one and not the rest.

As I said, I am going to select in the name tag and we are going to create a rule, I am not going to use this class and what I am going to do here is the following: I open square brackets, close square brackets and here in the middle I add that when the for attribute is the same I open and close quotation marks although if I didn't it would also work and I put that it is equal to input_2_8 , I am going to tell it that I want the color to be equal to red, that is, red.

So, notice that only this label has been modified, the rest remains the same.

I have been able to use the label here but by using the attributes we have been able to modify this and it is also very interesting because if we find out here in the help, something can be done that can be even more useful.

I can imagine that I only want the color to be changed or to put an icon for example when it is a link to a pdf or when it has a specific url for example as you can see here so we could do this to change any of the attributes in this case I I am going to make use of this rule and you are going to see how it works.

If I come here to my page here we see that I have a link, in this case I have the link that is here and as you can see I have no class, no identifier, of this link how could I modify it, well notice if I click like this In this case, if I only make a rule for all the links, all of them would be modified, but I don't want all of them to be modified, I want only the links that have, for example, in the link written as making a page.

For example, what I can do here is open square brackets and close them. I like to close them at the beginning so that I don't forget, and I ask that when the href attribute is present, I'm going to put an asterisk on it, as we saw in the help, for everything that is here in the middle and I am going to tell you that , I write open bracket and close it I put href asterisk the same I open and close quotes and here I am going to say for example that it could be written how to make a page and here I am going to say that I want the color to also be red, for example, and you see that it has changed.

What's more, if I tell you here to change the links when the link is how to make a page I put something else here, you will see that it doesn't change because something else isn't written there instead if I put here for example simply How to make a page this is it to work.

So we can be specific so that there are no more cases, but we can see that we don't always need a class or an identifier to be able to modify things by css.

It seems to me that it can get us out of a lot of trouble, that's why I bring you this tutorial, I hope you liked it, see you next time 😉