A Selenium IDE használata szkriptekkel & Parancsok (érvényesítés, ellenőrzés)

Tartalomjegyzék:

Anonim

A tesztelés alatt álló webalkalmazásként a Mercury Tours webhelyet fogjuk használni. Ez egy online repülőjegy-foglalási rendszer, amely tartalmazza az összes elemet, amelyre szükségünk van a bemutatóhoz. Az URL-címe: http://demo.guru99.com/test/newtours/, és ez lesz az alap URL -ünk.

Hozzon létre egy szkriptet felvétel segítségével

Most hozzuk létre az első teszt szkriptünket a Selenium IDE-ben a legáltalánosabb módszerrel - rögzítéssel. Ezután a lejátszási funkció segítségével végrehajtjuk a szkriptünket.

1. lépés

  • Indítsa el a Firefox és a Selenium IDE programot.
  • Írja be az Alap URL-cím értékét: http://demo.guru99.com/test/newtours/.
  • Kapcsolja be a Felvétel gombot (ha alapértelmezés szerint még nincs bekapcsolva).
2. lépés

A Firefox böngészőben keresse fel a http://demo.guru99.com/test/newtours/ oldalt. A Firefoxnak el kell vinnie az alább látható oldalra.

3. lépés
  • Kattintson a jobb gombbal az oldal bármely üres helyére, például a bal felső sarokban található Mercury Tours logóra. Ez megnyitja a Selenium IDE helyi menüt. Megjegyzés: Ne kattintson semmilyen hiperhivatkozású objektumra vagy képre
  • Válassza a "rendelkezésre álló parancsok megjelenítése" lehetőséget.
  • Ezután válassza az "assertTitle Pontos: Üdvözöljük: Mercury Tours" lehetőséget. Ez egy olyan parancs, amely biztosítja, hogy az oldal címe helyes legyen.
4. lépés
  • A Mercury Tours "Felhasználónév" szövegmezőjébe írjon be egy érvénytelen felhasználónevet, "invalidUNN".
  • A "Jelszó" szövegmezőbe írjon be egy érvénytelen jelszót, "érvénytelenPWD".
5. lépés
  • Kattintson a "Bejelentkezés" gombra. A Firefoxnak erre az oldalra kell vinnie.
6. lépés

A felvétel leállításához kapcsolja ki a rögzítés gombot. A szkriptnek most úgy kell kinéznie, mint az alább látható.

7. lépés

Most, hogy elkészültünk a teszt szkriptünkkel, mentjük egy tesztesetben. A Fájl menüben válassza a "Teszteset mentése" lehetőséget. Alternatív megoldásként egyszerűen megnyomhatja a Ctrl + S billentyűkombinációt.

8. lépés
  • Válassza ki a kívánt helyet, majd nevezze el a tesztesetet "Invalid_login" néven.
  • Kattintson a "Mentés" gombra.
9. lépés

Figyelje meg, hogy a fájlt HTML-ként mentették.

10. lépés

Menjen vissza a Selenium IDE oldalra, és kattintson a Lejátszás gombra a teljes szkript végrehajtásához. A szelén IDE-nek képesnek kell lennie mindent hibátlanul megismételni.

Bevezetés a szelénparancsokba - Selenese

  • A Selenese parancsoknak legfeljebb két paramétere lehet: cél és érték.
  • A paraméterek nem mindig szükségesek. Attól függ, hány parancsra lesz szükség.

3 parancstípus

Műveletek

Ezek olyan parancsok, amelyek közvetlenül interakcióba lépnek az oldalelemekkel.

Példa: a "click" parancs egy művelet, mert közvetlenül interakcióba lép azzal az elemmel, amelyre kattint.

A "type" parancs azért is művelet, mert értékeket ír be egy szövegmezőbe, és a szövegdoboz cserébe megmutatja azokat. Kétirányú interakció van közted és a szövegmező között.

Hozzáférők

Ezek olyan parancsok, amelyek lehetővé teszik az értékek tárolását egy változóban.

Példa: a "storeTitle" parancs hozzáférõ, mert csak "elolvassa" az oldal címét és elmenti egy változóba. Nem lép kapcsolatba az oldal egyetlen elemével sem.

Állítások

Ezek olyan parancsok, amelyek ellenőrzik, hogy teljesül-e egy bizonyos feltétel.

3 állítástípus

  • Állítsd . Ha egy "assert" parancs meghiúsul, a teszt azonnal leáll.
  • Ellenőrizze . Ha egy "ellenőriz" parancs meghiúsul, a Selenium IDE naplózza ezt a hibát, és folytatja a teszt végrehajtását.
  • WaitFor . Mielőtt továbblépne a következő parancsra, a "waitFor" parancsok először megvárják, amíg egy bizonyos feltétel igaz lesz.
    • Ha a feltétel a várakozási időn belül igaz lesz, a lépés elmúlik.
    • Ha a feltétel nem válik valóra, a lépés sikertelen. A hiba naplózásra kerül, és a teszt végrehajtása folytatódik a következő paranccsal.
    • Alapértelmezés szerint az időkorlát értéke 30 másodperc. Ezt megváltoztathatja a Szelén IDE beállításai párbeszédpanelen az Általános fül alatt.

Állítás és ellenőrzés

Közös parancsok

Parancs Paraméterek száma Leírás
nyisd ki 0 - 2

Megnyit egy oldalt egy URL segítségével.

kattintson / kattintsonAndWait 1

Egy megadott elemre kattint.

type / typeKeys 2

Karakterek sorozatát írja be.

VerifyTitle / assertTitle 1

Összehasonlítja a tényleges oldal címet egy várható értékkel.

VerifyTextPresent 1

Ellenőrzi, hogy található-e egy bizonyos szöveg az oldalon.

verElementPresent 1

Ellenőrzi egy bizonyos elem jelenlétét.

VerTable 2

Összehasonlítja a táblázat tartalmát a várható értékekkel.

waitForPageToLoad 1

A végrehajtást szünetelteti, amíg az oldal teljesen betöltődik.

waitForElementPresent 1

Szünetelteti a végrehajtást, amíg a megadott elem meg nem jelenik.

Hozzon létre egy szkriptet kézzel a Firebug segítségével

Most újra elkészítjük ugyanazt a tesztesetet a parancsok beírásával. Ezúttal a Firebug-ot kell használnunk.

1. lépés
  • Nyissa meg a Firefox és a Selenium IDE programot.
  • Írja be az alap URL-t (http://demo.guru99.com/test/newtours/).
  • A felvétel gombnak ki kell kapcsolnia.
2. lépés: Kattintson a szerkesztő legfelső üres sorára.

Írja be az "open" parancsot a Parancs szövegmezőbe, és nyomja meg az Enter billentyűt.

3. lépés
  • Keresse meg a Firefoxot az alap URL-re és aktiválja a Firebug programot
  • A Selenium IDE Editor panelen válassza ki a második sort (az "open" parancs alatti sort), és a Parancs mezőbe írja be az "assertTitle" parancsot, és hozza létre a második parancsot.
  • Használja bátran az automatikus kiegészítést.
4. lépés
  • A Firebug alkalmazásban bontsa ki a címkét a címke megjelenítéséhez.</li> <li>Kattintson a <title> címke értékére (ami „Welcome: Mercury Tours”), és illessze be a Szerkesztő Cél mezőjébe.</li> </ul> </td> </tr> <tr> <td><strong>5. lépés</strong> <ul> <li>A harmadik parancs létrehozásához kattintson a Szerkesztő harmadik üres sorára, és írja be a "type" parancsot a Parancs szövegmezőbe.</li> <li>A Firebug alkalmazásban kattintson az "Ellenőrzés" gombra.</li> </ul> </td> </tr> <tr> <td>Kattintson a Felhasználónév szövegmezőre. Figyelje meg, hogy a Firebug automatikusan megmutatja az elem HTML kódját.</td> </tr> <tr> <td><strong>6. lépés</strong> <p>Figyelje meg, hogy a Felhasználónév szövegmezőnek nincs azonosítója, de van egy NAME attribútuma. Ezért a NEVET fogjuk használni lokátorként. Másolja a NAME értéket, és illessze be a Selenium IDE Cél mezőjébe.</p> <p>A Cél szövegmezőben továbbra is a "userName" előtagot írja be a "name =" kifejezésre, jelezve, hogy a Selenium IDE olyan elemet kell megcéloznia, amelynek NAME attribútuma "userName".</p> <p>Írja be az "invalidUN" értéket a Selenium IDE Érték szövegmezőjébe. A teszt szkriptjének most úgy kell kinéznie, mint az alábbi kép. A harmadik paranccsal végeztünk. Megjegyzés: Az érvénytelenUN helyett bármilyen más szöveges karakterláncot is megadhat. De a Selenium IDE megkülönbözteti a kis- és nagybetűket, és pontosan úgy írja be az értékeket / attribútumokat, mint az alkalmazásban.</p> </td> </tr> <tr> <td><strong>7. lépés</strong> <ul> <li>A negyedik parancs létrehozásához írja be a "type" parancsot a Parancs szövegmezőbe.</li> <li>Ismét használja a Firebug "Ellenőrzés" gombját, hogy megkeresse a "Jelszó" szövegmező helyét.</li> </ul> <ul> <li> <p>Illessze be a NAME attribútumot ("jelszó") a Cél mezőbe, és előtagolja a következőt: "name ="</p> </li> <li> <p>Írja be az "invalidPW" értéket a Selenium IDE Érték mezőjébe. A teszt szkriptjének most úgy kell kinéznie, mint az alábbi kép.</p> </li> </ul> </td> </tr> <tr> <td><strong>8. lépés</strong> <ul> <li>Az ötödik parancshoz írja be a "clickAndWait" parancsot a Selenium IDE Parancs mezőjébe.</li> <li>A Firebug "Ellenőrzés" gombjával keresse meg a "Bejelentkezés" gomb keresőjét.</li> </ul> <ul> <li>Illessze be a NAME attribútum ("login") értékét a Cél szövegmezőbe, és előtte írja be a "name =" szót.</li> <li>A teszt szkriptjének most úgy kell kinéznie, mint az alábbi kép.</li> </ul> </td> </tr> </tbody> </table> <p><strong>9. lépés:</strong> Mentsük el a tesztesetet ugyanúgy, mint az előző szakaszban.</p> <a id="menu-6"></a> <h2>A Keresés gomb használata</h2> <p><strong>A Selenium IDE Find (Keresés) gombjával ellenőrizhetjük, hogy valóban az a megfelelő felhasználói felület-e, amit a Cél szövegmezőbe tettünk.</strong></p> <p>Használjuk az Invalid_login tesztesetet, amelyet az előző szakaszokban hoztunk létre. Kattintson bármelyik Target bejegyzéssel rendelkező parancsra, mondjuk a harmadik parancsra.</p> <p>Kattintson a Keresés gombra. Figyelje meg, hogy a Mercury Tours oldalon a Felhasználónév szövegmező egy pillanatra kiemelve jelenik meg.</p> <p>Ez azt jelzi, hogy a Selenium IDE képes volt a várt elem megfelelő felismerésére és elérésére. Ha a Keresés gomb egy másik elemet emelt ki, vagy egyáltalán nem tartalmaz elemet, akkor valami nem stimmel a szkriptben.</p> <a id="menu-7"></a> <h2>Parancs végrehajtása</h2> <p><strong>Ez lehetővé teszi bármely parancs végrehajtását a teljes tesztesemény futtatása nélkül</strong> . Csak kattintson a végrehajtani kívánt sorra, majd kattintson a "Műveletek> A parancs végrehajtása" gombra a menüsoron, vagy egyszerűen nyomja meg az "X" billentyűt.</p> <p><strong>1. lépés.</strong> Győződjön meg arról, hogy böngészője a Mercury Tours honlapján található. Kattintson a végrehajtani kívánt parancsra. Ebben a példában kattintson a "type | felhasználónév | érvénytelenUN" sorra.</p> <p><strong>2. lépés:</strong> Nyomja meg az "X" billentyűt.</p> <p><strong>3. lépés.</strong> Figyelje meg, hogy a felhasználónév szövegdoboza "érvénytelen" szöveggel lesz feltöltve</p> <p><strong>A parancsok ilyen módon történő végrehajtása nagymértékben függ attól az oldaltól, amelyet a Firefox jelenleg megjelenít</strong> . Ez azt jelenti, hogy ha a fenti példát kipróbálja, hogy a Mercury Tours helyett a Google kezdőlapja jelenik meg, akkor a lépés sikertelen lesz, mert a Google honlapján nincs szövegmező "userName" attribútummal.</p> <a id="menu-8"></a> <h2>Kezdőpont</h2> <p><strong>A kezdőpont egy olyan mutató, amely megmondja a Selenium IDE-nek, hogy mely sorok indulnak el</strong> . <strong>Parancsikonja "S".</strong></p> <p>A fenti példában a lejátszás a harmadik sorban kezdődik (írja be | jelszó | érvénytelenPW). <strong>Egy tesztszkriptben csak egy kezdőpont lehet.</strong></p> <p>A kiindulási pont hasonló az Execute Command-hoz, mivel azok az éppen megjelenített oldaltól függenek. A kezdőpont nem fog sikerülni, ha rossz oldalon van.</p> <a id="menu-9"></a> <h2>Töréspontok</h2> <p>A töréspontok olyan mutatók, amelyek megmondják a Selenium IDE-nek, hol kell automatikusan szüneteltetni a tesztet. <strong>A gyorsbillentyű "B".</strong></p> <p>A sárga kiemelés azt jelenti, hogy az aktuális lépés függőben van. Ez azt bizonyítja, hogy a Selenium IDE szüneteltette a végrehajtást ebben a lépésben. <strong>Egy tesztesetben több töréspont is rendelkezhet.</strong></p> <a id="menu-10"></a> <h2>Lépés</h2> <p>Ez lehetővé teszi, hogy a tesztesemények szüneteltetése után egyenként végrehajtsa a következő parancsokat. Használjuk az előző "Töréspontok" szakasz forgatókönyvét.</p> <table> <tbody> <tr> <td width="50%"> </td> <td> <p><strong>Mielőtt a "Lépés" gombra kattintana.</strong></p> <p>A teszteset szünetel a "clickAndWait | login" sorban.</p> </td> </tr> <tr> <td width="50%"> </td> <td> <p><strong>Miután rákattint a "Lépés" gombra.</strong></p> <p>A "clickAndWait | login" sor fut, és szünetel a következő parancsra (verifyTitle | Bejelentkezés: Mercury Tours).</p> <p>Figyelje meg, hogy a következő sor szünetel, bár ott nincs töréspont. Ez a Lépés funkció fő célja - egyesével végrehajtja a következő parancsokat, hogy minden lépés után több időt biztosítson az eredmény ellenőrzésére.</p> </td> </tr> </tbody> </table> <a id="menu-11"></a> <h2>Fontos tudnivalók, ha más formátumokat használ a Forrás nézetben</h2> <p><strong>A szelén IDE csak HTML esetén működik jól - más formátumok még mindig kísérleti módban vannak</strong> . Ez <strong>nem tanácsos</strong> létrehozni vagy szerkeszteni vizsgálatok során más formátumok Forrás megtekintése mert még sok munkára van szükség annak érdekében, hogy stabil. Az alábbiakban ismertetjük az 1.9.1-es verzió ismert hibáit.</p> <ul> <li>Csak akkor állíthat le lejátszást, és nem térhet vissza a Táblázat nézetre, ha visszaáll a HTML-re.</li> <li>Az egyetlen módja a parancsok biztonságos hozzáadásának a forráskódon az, ha rögzíti őket.</li> <li>Ha manuálisan módosítja a forráskódot, akkor minden elveszik, ha másik formátumra vált.</li> <li>Bár mentheti a tesztesetet a Source View-ban, a Selenium IDE nem tudja megnyitni.</li> </ul> <p><strong>A Selenese tesztek konvertálásának ajánlott módja a Fájl menü "Teszteset exportálása másként" opciójának használata, és nem a Forrás nézet segítségével.</strong></p> <a id="menu-12"></a> <h2>Összegzés</h2> <ul> <li>Tesztszkriptek létrehozhatók a parancsok és paraméterek manuális rögzítésével vagy beírásával.</li> <li>A szkriptek manuális létrehozásakor a Firebug-t használják a lokátor lekérésére.</li> <li>A Keresés gombbal ellenőrizhető, hogy a parancs képes-e elérni a megfelelő elemet.</li> <li>A Táblázat nézet egy tesztparancsot táblázatos formában jelenít meg, míg a Forrás nézet HTML formátumban.</li> <li>A Forrás nézet megváltoztatása nem HTML formátumra még mindig kísérleti jellegű.</li> <li>Ne használja a Forrás nézetet más formátumú tesztek létrehozásához. Használja inkább az Exportálás funkciókat.</li> <li>A paraméterek nem mindig szükségesek. A parancstól függ.</li> <li>Háromféle parancs létezik:</li> <ul> <li>Műveletek - közvetlenül interakcióba lépnek az oldalelemekkel</li> <li>Hozzáférők - "elolvassa" egy elem tulajdonságát és eltárolja azt egy változóban</li> <li>Állítások - összehasonlítja a tényleges értéket a várható értékkel</li> </ul> <li>Az állításoknak három típusa van:</li> <ul> <li>Állítás - kudarc után a következő lépéseket már nem hajtják végre</li> <li>Ellenőrizze - hiba esetén a következő lépéseket továbbra is végrehajtják.</li> <li>WaitFor - átmegy, ha a megadott feltétel az időkorláton belül igaz lesz; különben nem fog sikerülni</li> </ul> <li>A leggyakoribb parancsok a következők:</li> <ul> <li>nyisd ki</li> <li>kattintson / kattintsonAndWait</li> <li>type / typeKeys</li> <li>VerifyTitle / assertTitle</li> <li>VerifyTextPresent</li> <li>verElementPresent</li> <li>VerTable</li> <li>waitForPageToLoad</li> <li>waitForElementPresent</li> </ul> </ul> </div> </article> </div> </div> </div> </div> </div> <aside class="col-lg-4 sidebar sidebar--right"> <div class="widget widget-popular-posts"> <h2 class="widget-title">Népszerű Bejegyzések</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8004237-188-exploring-the-overlapping-header-pattern" title="# 188: Az átfedő fejlécminta feltárása - CSS-trükkök" rel="bookmark"><img src="https://cdn.css-code.org/9933970/188_exploring_the_overlapping_header_pattern_css-tricks.png.webp" loading="lazy" alt="# 188: Az átfedő fejlécminta feltárása - CSS-trükkök" title="# 188: Az átfedő fejlécminta feltárása - CSS-trükkök" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8004237-188-exploring-the-overlapping-header-pattern" title="# 188: Az átfedő fejlécminta feltárása - CSS-trükkök" rel="bookmark"># 188: Az átfedő fejlécminta feltárása - CSS-trükkök 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8004238-169-how-to-think-like-a-front-end-developer" title="# 169: Hogyan kell gondolkodni, mint egy front-end fejlesztő - CSS-trükkök" rel="bookmark"><img src="https://cdn.css-code.org/7751744/169_how_to_think_like_a_front-end_developer_css-tricks.png.webp" loading="lazy" alt="# 169: Hogyan kell gondolkodni, mint egy front-end fejlesztő - CSS-trükkök" title="# 169: Hogyan kell gondolkodni, mint egy front-end fejlesztő - CSS-trükkök" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8004238-169-how-to-think-like-a-front-end-developer" title="# 169: Hogyan kell gondolkodni, mint egy front-end fejlesztő - CSS-trükkök" rel="bookmark"># 169: Hogyan kell gondolkodni, mint egy front-end fejlesztő - CSS-trükkök 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8004239-192-git-tricks-for-getting-yourself-out-of-trouble" title="# 192: Git trükkök a bajból - CSS-trükkök" rel="bookmark"><img src="https://cdn.css-code.org/5392164/192_git_tricks_for_getting_yourself_out_of_trouble_css-tricks.png.webp" loading="lazy" alt="# 192: Git trükkök a bajból - CSS-trükkök" title="# 192: Git trükkök a bajból - CSS-trükkök" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8004239-192-git-tricks-for-getting-yourself-out-of-trouble" title="# 192: Git trükkök a bajból - CSS-trükkök" rel="bookmark"># 192: Git trükkök a bajból - CSS-trükkök 2025</a></h3> </div> </div> </li> </ul> </div> <div class="widget widget-popular-posts"> <h2 class="widget-title">Legjobb értékelés a hónapban</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003139-nth-of-type" title=": n-edik típus - CSS-trükkök" rel="bookmark">: n-edik típus - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003140-only-of-type" title=": csak típusú - CSS-trükkök" rel="bookmark">: csak típusú - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003141-not" title=": nem () - CSS-trükkök" rel="bookmark">: nem () - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003143-marker" title=":: marker - CSS-trükkök" rel="bookmark">:: marker - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003146-root" title=": gyökér - CSS-trükkök" rel="bookmark">: gyökér - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003147-required" title=": kötelező - CSS-trükkök" rel="bookmark">: kötelező - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003149-target" title=": cél - CSS-trükkök" rel="bookmark">: cél - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003150-type" title="Típus - CSS-trükkök" rel="bookmark">Típus - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003151-universal" title="Univerzális - CSS-trükkök" rel="bookmark">Univerzális - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003152-read-write-read-only" title=": írás-írás /: csak olvasható - CSS-trükkök" rel="bookmark">: írás-írás /: csak olvasható - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003153-selection" title=":: válogatás - CSS-trükkök" rel="bookmark">:: válogatás - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003154-placeholder" title=":: helyőrző - CSS-trükkök" rel="bookmark">:: helyőrző - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003155-valid" title=": érvényes - CSS-trükkök" rel="bookmark">: érvényes - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003156-visited" title=": meglátogatott - CSS-trükkök" rel="bookmark">: meglátogatott - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003157-user-invalid" title=": user-invalid - CSS-trükkök" rel="bookmark">: user-invalid - CSS-trükkök</a></h3> </div> </div> </li> </ul> </div> <div class="widget widget-popular-posts"> <h2 class="widget-title">Top Cikkek</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8003686-serving-up-universal-ie-6-stylesheet" title="Az univerzális IE 6 stíluslap kiszolgálása - CSS-trükkök" rel="bookmark"><img src="https://cdn.css-code.org/8660002/serving_up_universal_ie_6_stylesheet_css-tricks.png.webp" loading="lazy" alt="Az univerzális IE 6 stíluslap kiszolgálása - CSS-trükkök" title="Az univerzális IE 6 stíluslap kiszolgálása - CSS-trükkök" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003686-serving-up-universal-ie-6-stylesheet" title="Az univerzális IE 6 stíluslap kiszolgálása - CSS-trükkök" rel="bookmark">Az univerzális IE 6 stíluslap kiszolgálása - CSS-trükkök 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8003687-use-firebug-in-any-browser" title="Használja a Firebug alkalmazást bármelyik böngészőben - CSS-trükkök" rel="bookmark"><img src="https://cdn.css-code.org/3253087/use_firebug_in_any_browser_css-tricks.png.webp" loading="lazy" alt="Használja a Firebug alkalmazást bármelyik böngészőben - CSS-trükkök" title="Használja a Firebug alkalmazást bármelyik böngészőben - CSS-trükkök" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003687-use-firebug-in-any-browser" title="Használja a Firebug alkalmazást bármelyik böngészőben - CSS-trükkök" rel="bookmark">Használja a Firebug alkalmazást bármelyik böngészőben - CSS-trükkök 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8003688-view-source-of-rss-feed-in-firefox" title="Az RSS-hírforrás megtekintése a Firefoxban - CSS-trükkök" rel="bookmark"><img src="https://cdn.css-code.org/2830732/view_source_of_rss_feed_in_firefox_css-tricks.png.webp" loading="lazy" alt="Az RSS-hírforrás megtekintése a Firefoxban - CSS-trükkök" title="Az RSS-hírforrás megtekintése a Firefoxban - CSS-trükkök" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003688-view-source-of-rss-feed-in-firefox" title="Az RSS-hírforrás megtekintése a Firefoxban - CSS-trükkök" rel="bookmark">Az RSS-hírforrás megtekintése a Firefoxban - CSS-trükkök 2025</a></h3> </div> </div> </li> </ul> </div> </aside> </div> </div> <footer class="footer footer--dark"> <div class="container"> <div class="footer__widgets"> <div class="row"> <div class="col-lg-4"> <div class="widget"> <h2 class="widget-title">Népszerű Bejegyzések</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226180-ux-vs-ui-10-most-important-differences-you-must-know" title="UX vs UI: 10 legfontosabb különbség, amelyet tudnia kell!" rel="bookmark">UX vs UI: 10 legfontosabb különbség, amelyet tudnia kell!</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226181-difference-between-local-and-global-variable" title="Különbség a helyi és a globális változó között" rel="bookmark">Különbség a helyi és a globális változó között</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226182-ar-vs-vr-difference-between-augmented-reality-virtual-reality" title="AR Vs VR: Különbség a kiterjesztett valóság, a virtuális valóság között" rel="bookmark">AR Vs VR: Különbség a kiterjesztett valóság, a virtuális valóság között</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226183-32-bit-vs-64-bit-key-differences" title="32 bites és 64 bites: legfontosabb különbségek" rel="bookmark">32 bites és 64 bites: legfontosabb különbségek</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226184-stack-vs-heap-know-the-difference" title="Verem vs kupac: Ismerje meg a különbséget" rel="bookmark">Verem vs kupac: Ismerje meg a különbséget</a></h3> </div> </div> </li> </ul> </div> </div> <div class="col-lg-4"> <div class="widget"> <h2 class="widget-title">Szerkesztő Választása</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226201-21-best-ccleaner-alternatives-in-2021-freepaid" title="21 legjobb CCleaner alternatíva 2021-ben (ingyenes / fizetős)" rel="bookmark">21 legjobb CCleaner alternatíva 2021-ben (ingyenes / fizetős)</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226202-12-best-free-pc-cleaner-tuneup-utility-pc-optimizer-software" title="12 A legjobb ingyenes PC-tisztító - TuneUp segédprogram PC-optimalizáló szoftver" rel="bookmark">12 A legjobb ingyenes PC-tisztító - TuneUp segédprogram PC-optimalizáló szoftver</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226203-20-best-mp3-music-downloader-app-free-songs-download" title="20 legjobb MP3 zene letöltő alkalmazás - INGYENES dalok letöltése" rel="bookmark">20 legjobb MP3 zene letöltő alkalmazás - INGYENES dalok letöltése</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226204-20-best-free-registry-cleaners-in-2021" title="20 LEGJOBB ingyenes nyilvántartó tisztító 2021-ben" rel="bookmark">20 LEGJOBB ingyenes nyilvántartó tisztító 2021-ben</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226205-15-best-download-manager-for-windows-pc-2021" title="15+ BEST Download Manager Windows PC-hez (2021)" rel="bookmark">15+ BEST Download Manager Windows PC-hez (2021)</a></h3> </div> </div> </li> </ul> </div> </div> <div class="col-lg-4"> <div class="widget"> <h2 class="widget-title">Top Cikkek</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225949-how-to-write-macros-in-excel-macro-tutorial-what-is-and-use" title="Makrók írása Excelben: Makró bemutató - Mi a & Használat" rel="bookmark">Makrók írása Excelben: Makró bemutató - Mi a & Használat</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225950-excel-vba-range-object" title="Excel VBA tartomány objektum" rel="bookmark">Excel VBA tartomány objektum</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225951-top-78-iot-interview-questions-and-answers" title="A 78 legnépszerűbb internetes interjú kérdése és válasza" rel="bookmark">A 78 legnépszerűbb internetes interjú kérdése és válasza</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225952-23-best-web-development-ide-2021-update" title="23 legjobb webfejlesztési IDE (2021-es frissítés)" rel="bookmark">23 legjobb webfejlesztési IDE (2021-es frissítés)</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225954-scatter-plot-in-r-using-ggplot2-with-example" title="Szórjon ábrát R-ben a ggplot2 segítségével (a példával)" rel="bookmark">Szórjon ábrát R-ben a ggplot2 segítségével (a példával)</a></h3> </div> </div> </li> </ul> </div> </div> </div> <p>© Copyright hu.css-code.org, 2025 Október | <a href="https://hu.css-code.org/about-site" title="A helyszínről">A helyszínről</a> | <a href="https://hu.css-code.org/contacts" title="Kapcsolattartó">Kapcsolattartó</a> | <a href="https://hu.css-code.org/privacy-policy" title="Adatvédelmi irányelvek">Adatvédelmi irányelvek</a>. </p> </div> </div> </footer> <link href="https://css-code.org/template/css/style.min.css" rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'" /> </body> </html>