Seleccionar el CSS secundario sin un elemento específico.
Quiero aplicar estilos de CSS a todos los elementos mat-tab-group
sin afectar el estilo del elemento app-form
.
<div class="area">
<childhere></childhere>
<mat-tab-group>
<mat-tab *ngFor="..." [label]="label">
<form [formGroup]="formGroup">
<div class="inside-tab">
<mat-form-field>...</mat-form-field>
<mat-form-field>...</mat-form-field>
<mat-form-field>...</mat-form-field>
<mat-form-field>...</mat-form-field>
</div>
<app-form></app-form>
</form>
</mat-tab>
</mat-tab-group>
</div>
He intentado usar la propiedad :not pero no está funcionando.
mat-tab-group > mat-tab > form :not(:last-child){
background-color: #009926; //para probar
}
¿Alguna sugerencia?
davy.ai
Para aplicar un estilo CSS en todos los elementos
mat-tab-group
sin afectar el estilo del elementoapp-form
, puedes usar el selector CSS:not()
de la siguiente manera:Este selector apunta a todos los elementos
mat-form-field
que son hijos directos dediv.area
, pero no son el último elementomat-tab-group
. El selector:not(:last-of-type)
coincide con todos los elementosmat-tab-group
excepto el último. Esto garantiza que el estilo se aplique a todos los elementosmat-tab-group
excepto el último.Ten en cuenta que este selector es específico para esta estructura HTML en particular y puede necesitar ajustarse si la estructura cambia.