Come selezionare un elemento in CSS se non conosciamo la sua Classe o Identificatore

Ciao ragazzi come state?

In questo video vedremo come possiamo modificare lo stile, il design di qualsiasi modulo o qualsiasi altro elemento della nostra pagina web se non abbiamo un identificatore e una classe.

Vedremo come farlo in CSS se mancano questi elementi, la classe o l'identificatore.

È una cosa che mi ha chiesto uno studente e vedremo come si potrebbe fare, mi sembra molto interessante ed è per questo che volevo mostrarvi che si fa in un modo molto semplice, anche per farlo useremo l'aiuto e in questo caso vedremo che oltre agli identificatori e alle classi possiamo effettuare chiamate tramite gli attributi.

Quindi grazie a questo possiamo farlo, non abbiate paura di tutto ciò che vedete qui perché lo faremo in un modo molto semplice, in questo caso modificherò questo tag, nel nome tag ma non Non voglio che il tag email venga modificato, quindi se faccio clic con il tasto destro, ispeziono posso vedere il codice sorgente in Chrome.

In questo caso, se ti rendi conto che questa etichetta ha una classe ma non la userò, immagina che non avesse questa classe, è molto semplice, infatti, se l'ho selezionata e qui clicco su altro genererà una regola già con la classe scritta ma in questo caso eliminerò la classe perché immagino che non esistesse, quindi grazie all'attributo, in questo caso, FOR che è l'attributo che abbiamo qui.

Se ci rendiamo conto che l'attributo ha il valore di input_2_8, se seleziono il tag email, ad esempio, vediamo che è input_2_2, ovvero ognuno di questi tag ha un valore diverso, quindi posso modificarne uno e non il resto.

Come ho detto, selezionerò nella targhetta del nome e creeremo una regola, non userò questa classe e quello che farò qui è il seguente: apro le parentesi quadre, chiudo le parentesi quadre e qui in mezzo aggiungo che quando l'attributo for È lo stesso, apro e chiudo le virgolette, anche se se non lo facessi funzionerebbe anche e metto che è uguale a input_2_8 , vado a digli che voglio che il colore sia uguale al rosso, cioè rosso.

Quindi, nota che solo questa etichetta è stata modificata, il resto rimane lo stesso.

Sono stato in grado di utilizzare l'etichetta qui, ma utilizzando gli attributi siamo stati in grado di modificarlo ed è anche molto interessante perché se scopriamo qui nell'aiuto, si può fare qualcosa che può essere ancora più utile.

Posso immaginare di voler solo cambiare il colore o inserire un'icona, ad esempio quando è un collegamento a un pdf o quando ha un URL specifico, ad esempio, come puoi vedere qui, quindi potremmo farlo per cambiare uno qualsiasi dei gli attributi in questo caso userò questa regola e vedrai come funziona.

Se vengo qui nella mia pagina qui vediamo che ho un link, in questo caso ho il link che c'è e come puoi vedere non ho classe, nessun identificatore, di questo link come potrei modificarlo, nota bene se clicco così In questo caso, se faccio solo una regola per tutti i link, verranno modificati tutti, ma non voglio che vengano modificati tutti, voglio solo i link che hanno, ad esempio , nel link scritto come fare una pagina.

Ad esempio, quello che posso fare qui è aprire le parentesi quadre e chiuderle. Mi piace chiuderle all'inizio in modo da non dimenticarle, e chiedo che quando l'attributo href è presente, inserirò un asterisco su di esso, come abbiamo visto nell'aiuto, per tutto ciò che è qui nel mezzo e te lo dico, scrivo parentesi aperta e la chiudo metto href asterisco lo stesso apro e chiudo le virgolette ed eccomi qui dirò ad esempio che si potrebbe scrivere come fare una pagina e qui dirò che voglio che anche il colore sia rosso, ad esempio, e vedi che è cambiato.

Inoltre, se ti dico qui di cambiare i link quando il link è come fare una pagina metto qui qualcos'altro, vedrai che non cambia perché lì non c'è scritto altro invece se metto qui per esempio semplicemente Come creare una pagina per farlo funzionare.

Quindi possiamo essere specifici in modo che non ci siano più casi, ma possiamo vedere che non abbiamo sempre bisogno di una classe o di un identificatore per poter modificare le cose tramite CSS.

Mi sembra che possa tirarci fuori da un sacco di guai, ecco perché vi porto questo tutorial, spero vi sia piaciuto, alla prossima volta 😉