Inspektur Konteks Penumpukan CSS di Chrome dengan OffiDocs

DESKRIPSI

Pernahkah Anda mencoba menggunakan properti z-index, hanya untuk mengetahui bahwa, setinggi apa pun Anda menyetelnya, properti itu tidak akan berfungsi seperti yang diharapkan? Itu karena properti z-index bergantung pada konsep implisit yang disebut "susun konteks".

Setelah mencari apa itu dan bagaimana cara kerjanya (informasi yang dapat Anda temukan di MDN), Anda dapat menggunakan ekstensi devtools ini untuk memeriksa konteks ini dan memecahkan masalah indeks-z yang mungkin Anda hadapi.

Ekstensi ini akan menambahkan panel baru yang akan menampilkan konteks penumpukan dalam tampilan pohon, dan juga akan menambahkan sidebar baru ke panel elemen dengan beberapa informasi berguna tentang elemen yang dipilih.

Untuk memeriksa dokumentasi yang mendalam, silakan merujuk ke halaman github: https://github.

com/andreadev-it/stacking-contexts-inspector Jika Anda ingin melaporkan masalah atau membuat permintaan fitur, silakan gunakan bagian Masalah di repositori github yang disebutkan di atas.

PERUBAHAN: • v.

1.1.13 - Dipindahkan ke manifes v3. Menambahkan indeks-z ke sidepan panel konteks susun juga.

• v.

1.1.12 - Memperbaiki bug dengan properti awalan vendor yang tidak terdeteksi saat memeriksa konteks penumpukan.

• v.

1.1.11 - Menambahkan nilai indeks-z ke bagian "Detail konteks" di sidebar.

• v.

1.1.10 - Menghapus permintaan izin yang tidak perlu untuk mematuhi Kebijakan Keamanan CWS.

• v.

1.1.9 - Mengimplementasikan inspeksi simpul DOM konteks dalam iframe dan shadowDOM.

Sekarang ekstensi juga berfungsi pada file lokal (file:/// skema).

• v.

1.1.8 - Menambahkan peringatan saat halaman berubah, dukungan untuk shadow DOM dan pengaturan dasar.

• v.

1.1.7 - Perbaikan gaya kecil.

Sekarang juga tersedia di Firefox karena sedikit perubahan kode.

Kode dibersihkan.

• v.

1.1.5 - Memperbaiki bug terkait transisi modul css (unstyled spinner).

• v.

1.1.4 - Menambahkan tema gelap (sebelumnya tidak dapat digunakan dengan tema gelap aktif).

• v.

1.1.3 - Memperbaiki bug pada navigasi halaman.

• v.

1.1.2 - Menambahkan dukungan untuk iframe tanpa atribut "src" (beberapa iframe dengan "src" mungkin berfungsi, tetapi seharusnya tidak diharapkan).

Selain itu, indikator pemuatan juga telah diperkenalkan di sidebar (panel elemen), dan sidebar sekarang memiliki tombol "segarkan konteks" sendiri.

• v.

1.1.1 - Memperbaiki bug di mana konteks statis yang dibuat oleh induknya memiliki tampilan fleksibel atau kisi yang tidak terdeteksi.

• v.

1.1.0 - Sekarang ekstensi berfungsi pada tab yang sudah terbuka saat diinstal.

- Menu konteks klik kanan telah diganti dengan tombol kontekstual, karena tidak berfungsi dengan benar (mungkin akan ditambahkan lagi di masa mendatang).

- Sekarang halaman pohon konteks akan menampilkan indikator pemuatan saat konteks penumpukan membutuhkan waktu lama untuk dimuat.

- Di sisi developer, semua kode sudah dipindahkan ke preact, sebagai langkah awal untuk menjadikannya open source.

• v.

1.0.1 - Perubahan aksesibilitas kecil dan penyesuaian visual.

Informasi tambahan:

- Ditawarkan oleh Andrea Dragotta
- Peringkat rata-rata: 3.92 bintang (menyukainya)
- Pengembang Alamat email ini dilindungi dari robot spam. Anda perlu mengaktifkan JavaScript untuk melihatnya.

Web inspektur Konteks Penumpukan CSS extension terintegrasi dengan OffiDocs Chromium secara online