Data di pubblicazione: 17 luglio 2026
Ti diamo il benvenuto ancora una volta nel riepilogo mensile di Baseline. A giugno 2026, field-sizing è diventato Baseline Newly available, consentendo ai controlli dei moduli di adattarsi automaticamente ai contenuti. Nel frattempo, una vasta gamma di funzionalità CSS, HTML e API web ha raggiunto lo stato Baseline Widely available, insieme a importanti aggiornamenti della community di sviluppatori.
Avvisi di Baseline sullo stato della piattaforma web
Tenere traccia di quando le funzionalità web diventano interoperabili è ora più facile grazie agli avvisi di Baseline nella dashboard Stato della piattaforma web. Se accedi con GitHub, puoi iscriverti alle notifiche per le funzionalità quando diventano Baseline Newly available, Widely available o ricevere nuove implementazioni del browser. Le iscrizioni possono essere configurate per inviare aggiornamenti via email o feed RSS personalizzati su base mensile, settimanale o immediata. Puoi limitare gli avvisi alle ricerche salvate, ad esempio tutte le funzionalità HTML, creare newsletter personalizzate, generare elenchi di funzionalità condivisibili o configurare webhook Slack per inviare notifiche al tuo team di ingegneria.
Scopri di più in Introducing Baseline Alerts.
Funzionalità Baseline Newly available
Le funzionalità in questa sezione sono supportate a partire da giugno 2026 nel set di browser principali e ora sono Baseline Newly available.
field-sizing
La proprietà CSS field-sizing consente di controllare il comportamento di dimensionamento degli elementi dei moduli, come <textarea>, <input> e <select>, che tradizionalmente hanno dimensioni fisse predefinite. Con field-sizing: content, i controlli dei moduli si espandono o si riducono automaticamente per adattarsi ai contenuti, riducendo la necessità di script di ridimensionamento automatico JavaScript personalizzati.
Scopri di più nella pagina di riferimento MDN per field-sizing.
Funzionalità Baseline Widely available
Le seguenti funzionalità sono diventate Baseline Widely available, il che significa che ora sono ampiamente compatibili e utilizzabili nei tuoi progetti.
Pseudo-classe :has()
Il selettore principale CSS :has() consente di applicare uno stile a un elemento in base ai relativi discendenti o fratelli successivi. Questa pseudo-classe funzionale consente di utilizzare pattern di layout condizionali direttamente in CSS senza la necessità di JavaScript per ispezionare le strutture DOM.
Scopri di più nella pagina MDN per la :has pseudo-classe.
HTMLIFrameElement.loading
La proprietà loading degli elementi <iframe> consente il caricamento lento dei frame incorporati. Se specifichi loading="lazy", i browser rimandano il caricamento degli iframe fuori schermo
fino a quando non vengono visualizzati vicino all'area visibile, risparmiando larghezza di banda di rete e overhead di caricamento iniziale
della pagina.
Scopri i dettagli nel riferimento MDN per HTMLIFrameElement.loading.
CanvasRenderingContext2D.reset()
Il metodo reset() nei contesti canvas 2D cancella lo stato del contesto di disegno, reimpostando le proprietà come trasformazioni, percorsi di ritaglio, stili di linea e stili di riempimento ai valori predefiniti. In questo modo, un contesto canvas può essere riutilizzato in modo pulito senza la pulizia manuale delle proprietà.
Scopri di più nella documentazione MDN per CanvasRenderingContext2D.reset.
Unità di lunghezza cap
L'unità relativa al carattere cap corrisponde all'altezza nominale del carattere dell'elemento. Consente di allineare e dimensionare gli elementi rispetto all'altezza delle lettere maiuscole, consentendo layout tipografici precisi.
Scopri di più nel riferimento MDN per le unità di lunghezza.
Proprietà counter-set
La proprietà CSS counter-set imposta un contatore CSS su un valore specificato, integrando counter-reset e counter-increment. Consente di controllare la manipolazione di elenchi numerati, strutture di documenti o sequenze di contatori personalizzate.
Scopri i dettagli nella pagina MDN per counter-set.
createImageBitmap()
Il metodo statico createImageBitmap() crea un'immagine bitmap asincrona
da varie origini di immagini, tra cui <img>, <canvas>, Blob, o
ImageData. Poiché decodifica le immagini al di fuori del thread principale, evita di bloccare il rendimento dell'interfaccia utente durante la gestione di grafici canvas complessi.
Scopri i dettagli dell'implementazione nella documentazione MDN per createImageBitmap.
Tipo di dati <easing-function>
Il tipo di dati CSS <easing-function> descrive le curve matematiche del tasso di variazione
per transizioni e animazioni. Oltre alle parole chiave standard come ease-in o cubic-bezier(), supporta funzioni come linear() per creare effetti di molla o rimbalzo personalizzati.
Scopri come utilizzarlo nel riferimento MDN per easing-function.
Selettore di nidificazione &
Il selettore di nidificazione & ancora in modo esplicito i selettori delle regole secondarie al relativo selettore principale quando si utilizza la nidificazione CSS integrata. Garantisce chiarezza e regole di specificità corrette quando si definiscono stati di passaggio del mouse, stato attivo o pseudo-classe nidificati.
Scopri i dettagli nella guida MDN per il selettore di nidificazione.
Precaricamento adattabile con rel="preload"
L'attributo media degli elementi <link rel="preload"> consente il precaricamento adattabile
delle risorse chiave. Combinando rel="preload" con le query supporti,
i browser scaricano solo le risorse che corrispondono alla larghezza dell'area visibile o alle caratteristiche di visualizzazione
dell'utente all'inizio del ciclo di vita del caricamento.
Scopri come utilizzarlo nella documentazione MDN per rel="preload".
HTMLMediaElement.preservesPitch
La proprietà preservesPitch degli elementi <audio> e <video> controlla
se il browser regola l'intonazione dell'audio quando cambia playbackRate.
Se lo imposti su false, puoi spostare l'intonazione quando acceleri o rallenti la riproduzione dei contenuti multimediali.
Scopri i dettagli nella pagina MDN per HTMLMediaElement.preservesPitch.
Pseudo-classe :dir()
La pseudo-classe CSS :dir() corrisponde agli elementi in base alla direzionalità del testo
(ad esempio ltr o rtl), alla direzione ereditata dagli attributi HTML come
dir o al contesto di testo calcolato.
Scopri di più nella pagina MDN per la pseudo-classe :dir.
Funzione matematica pow()
La funzione CSS pow() calcola i valori di potenza esponenziale direttamente all'interno delle dichiarazioni CSS, elevando un numero di base a un esponente (ad esempio, pow(2, 3)). In questo modo, si semplificano il ridimensionamento adattabile e le relazioni matematiche della griglia.
Scopri i dettagli nel riferimento MDN per la funzione pow.
Proprietà CSS mask
La proprietà abbreviata CSS mask nasconde parti di un elemento utilizzando immagini o gradienti come livelli di ritaglio. Combina le sottoproprietà come mask-image, mask-position e mask-repeat per creare effetti di mascheramento visivo complessi.
Scopri di più nella pagina MDN per la proprietà mask.
@media (scripting)
La funzionalità supporti scripting verifica se lo scripting lato client (ad esempio JavaScript) è abilitato e disponibile nel contesto del browser. In questo modo, gli stili di potenziamento progressivo possono essere destinati ad ambienti con o senza JavaScript attivo.
Scopri di più nel riferimento MDN per la funzionalità supporti scripting.
URL.canParse()
Il metodo statico URL.canParse() verifica se una determinata stringa è un URL valido,
analizzabile (con un URL di base facoltativo) senza generare un'eccezione,
semplificando la convalida dell'URL di runtime prima di creare un'istanza degli oggetti URL.
Scopri i dettagli dell'implementazione nella documentazione MDN per URL.canParse.
API Storage Access
L'API Storage Access fornisce un meccanismo per consentire ai contenuti cross-site incorporati
all'interno di <iframe> di terze parti di richiedere l'accesso ai cookie e allo spazio di archiviazione non partizionati, consentendo l'autenticazione e le interazioni con stato tra i limiti dei domini.
Scopri i dettagli nella pagina MDN per l'API Storage Access.
Conclusioni
Comunicaci se abbiamo dimenticato qualcosa di relativo a Baseline e ci assicureremo che venga acquisito in una futura edizione. Se hai domande o vuoi fornire feedback su Baseline, puoi segnalare un problema nel nostro strumento di monitoraggio dei problemi.