Kustuta/Peida Element laseb sul eemaldada või ajutiselt peita mis tahes elemendi veebilehel ühe klõpsuga. Puhasta lehti ekraanipiltide jaoks, eemalda häirivad reklaamid ja küpsiste bännerid või testi, kuidas paigutus näeb välja ilma teatud sektsioonideta — kõik mittepurustavalt.
Kas teed puhast ekraanipilti portfoolio jaoks, testid, kuidas lehepaigutus reflow'b, kui sektsioon eemaldatakse, või lihtsalt peidad tüütud popup kihistused, et saaksid all oleva sisu lugeda — Kustuta/Peida Element on tööriist. See pakub kahte režiimi: Kustuta (eemaldab elemendi täielikult DOMist, põhjustades ümbritseva sisu reflow ruumi) ja Peida (seab nähtavuse peidetuks, säilitades elemendi ruumi paigutuses). Mõlemad toimingud on Tühista'ga tagasipööratavad. Punane hõljumise kihistus näitab täpselt, milline element saab mõjutatud enne klõpsamist, nii et ei pea arvama. Tööriist hoiab kustutatud ja peidetud elementide jooksvat loendust ning saad neid tühistada ükshaaval või kõik korraga. Nagu kõik DevSuite tööriistad, on muudatused mittepurustavad — värskenda lehte ja kõik tuleb tagasi.
Kustuta režiimis klõpsa mis tahes elemendil, et see lehelt täielikult eemaldada. Element võetakse DOMist välja ja ümbritsev sisu reflow'b ruumi täitmiseks — täpselt nagu HTML poleks olemas. Suurepärane nägemiseks, kuidas leht näeb välja ilma konkreetsete sektsioonideta.
Peida režiimis klõpsa elemendil, et see muutuks nähtamatuks, säilitades selle ruumi paigutuses. Element muutub läbipaistvaks, kuid selle kasti mõõtmed jäävad alles, nii et ülejäänud lehe paigutus jääb täpselt samaks. Kasulik visuaalse kaalu testimiseks ilma paigutuse muutusteta.
Enne klõpsamist näitab hiire liigutamine punast poolläbipaistvat kihistust elemendil, mis saab mõjutatud. See eelvaade hoiab ära vale elemendi juhusliku kustutamise — alati näed täpselt, mida sa kavatsed eemaldada.
Iga kustutamise ja peitmise toiming jälgitakse tühistamise ajaloos. Klõpsa Tühista nupul, et viimane toiming tagasi pöörata, tuues elemendi tagasi. Saad järjest tühistada mitu toimingut, et oma muudatustes tagasi astuda.
Reaalajas loendur näitab, kui palju elemente oled kustutanud ja kui palju peitnud praeguses sessioonis. Ühe pilguga tead, kui palju muudatusi oled teinud ja kui palju tühistamisi on saadaval.
Kõik muudatused on puhtalt visuaalsed ja eksisteerivad ainult brauseri mälus. Lehe tegelikku koodi ei muudeta kunagi. Värskenda lehte mis tahes ajal, et koheselt taastada iga kustutatud ja peidetud element oma algseisu.
Eemalda küpsiste nõusoleku bännerid, vidinad, reklaamipopupid, kleepuvad päised ja uudiskirja kihistused enne ekraanipiltide tegemist. Hangi puhas, professionaalne lehe sisu ülesvõte ilma visuaalse segaduseta.
Mõtled, kuidas leht voolab ilma iseloomustuste sektsioonita? Või mis juhtub, kui eemaldad külgriba? Kustuta sektsioon ja vaata paigutuse reflow'd koheselt — pole vaja koodimuudatusi.
Sisurikkadel lehtedel sissetungivate reklaamidega peida reklaamielemendid, et saaksid lugeda artikleid ja dokumentatsiooni ilma häireteta. Sisu reflow'b saadaoleva ruumi täitmiseks.
Valmistud esitlust, mis viitab keerulisele veebilehele? Eemalda elemendid, mis pole sinu mõttepunkti jaoks asjakohased, jättes ainult sektsioonid, mida tahad arutada. Seejärel tee lihtsustatud vaatest ekraanipilt.
Kui elemendid kattuvad või varjavad üksteist, kustuta ülemine element, et näha, mis allpool on. See on kiirem kui z-index või display omaduste muutmine DevTools-is, kui sul on vaja vaid kiirelt vaadata.
Ava DevSuite Pro hõljuv dokk ja klõpsa Kustuta/Peida Element ikoonil. Vali Kustuta režiimi (eemaldab elemendi ja reflow'b paigutuse) või Peida režiimi (muudab nähtamatuks, kuid säilitab ruumi) vahel.
Liiguta hiirt üle lehe. Punane poolläbipaistev kihistus tõstab esile elemendi sinu kursori all, näidates täpselt, mida mõjutatakse, kui klõpsad.
Klõpsa esiletõstetud elemendil. Kustuta režiimis see eemaldatakse ja ümbritsev sisu reflow'b. Peida režiimis muutub see nähtamatuks, kuid selle ruum säilitatakse.
Jätka klõpsamist, et eemaldada rohkem elemente, või klõpsa Tühista, et tuua tagasi viimane eemaldatud/peidetud element. Toimingute loendur näitab sinu praeguseid muudatusi.
Eksperimenteerimine läbi? Värskenda lehte, et koheselt taastada iga element oma algseisu.
Paigaldage DevSuite Pro tasuta ja avage 39+ arendustööriista oma brauserile.
