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 id="container-5533149ee6411a5f99b370c693e87966"></div> </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="/8226508-mongodb-order-with-sort-and-limit-query-with-examples" title="MongoDB rendelés a Sort () & Limit () lekérdezés példákkal" rel="bookmark"><img src="https://cdn.css-code.org/1654600/mongodb_order_with_sort_ampamp_limit_query_with_examples.png.webp" loading="lazy" alt="MongoDB rendelés a Sort () & Limit () lekérdezés példákkal" title="MongoDB rendelés a Sort () & Limit () lekérdezés példákkal" 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="/8226508-mongodb-order-with-sort-and-limit-query-with-examples" title="MongoDB rendelés a Sort () & Limit () lekérdezés példákkal" rel="bookmark">MongoDB rendelés a Sort () & Limit () lekérdezés példákkal 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="/8226509-mongodb-count-and-remove-functions-with-examples" title="MongoDB Count () & Távolítsa el a () függvényeket példákkal" rel="bookmark"><img src="https://cdn.css-code.org/9299316/mongodb_count_ampamp_remove_functions_with_examples.png.webp" loading="lazy" alt="MongoDB Count () & Távolítsa el a () függvényeket példákkal" title="MongoDB Count () & Távolítsa el a () függvényeket példákkal" 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="/8226509-mongodb-count-and-remove-functions-with-examples" title="MongoDB Count () & Távolítsa el a () függvényeket példákkal" rel="bookmark">MongoDB Count () & Távolítsa el a () függvényeket példákkal 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="/8226510-mongodb-update-document-with-example" title="MongoDB Update () dokumentum példával" rel="bookmark"><img src="https://cdn.css-code.org/8603353/mongodb_update_document_with_example.png.webp" loading="lazy" alt="MongoDB Update () dokumentum példával" title="MongoDB Update () dokumentum példával" 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="/8226510-mongodb-update-document-with-example" title="MongoDB Update () dokumentum példával" rel="bookmark">MongoDB Update () dokumentum példával 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="/8004081-find-id-of-top-most-parent-page" title="A legfelsőbb szülőoldal azonosítójának megkeresése - CSS-trükkök" rel="bookmark">A legfelsőbb szülőoldal azonosítójának megkeresése - 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="/8004082-embed-a-page-inside-a-page" title="Oldal beágyazása az oldal belsejébe - CSS-trükkök" rel="bookmark">Oldal beágyazása az oldal belsejébe - 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="/8004083-dynamic-title-tag" title="Dinamikus címcímke - CSS-trükkök" rel="bookmark">Dinamikus címcímke - 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="/8004084-get-content-by-id" title="Tartalom letöltése azonosító alapján - CSS-trükkök" rel="bookmark">Tartalom letöltése azonosító alapján - 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="/8004085-get-featured-image-url" title="A kiemelt kép URL-je - CSS-trükkök" rel="bookmark">A kiemelt kép URL-je - 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="/8004086-get-id-from-page-name" title="Azonosító beszerzése az Oldal neve - CSS-trükkök" rel="bookmark">Azonosító beszerzése az Oldal neve - 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="/8004087-html5-shim-in-functions-php" title="HTML5 Shim a függvényekben.php - CSS-trükkök" rel="bookmark">HTML5 Shim a függvényekben.php - 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="/8004088-id-the-body-based-on-url" title="A törzs azonosítása az URL alapján - CSS-trükkök" rel="bookmark">A törzs azonosítása az URL alapján - 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="/8004089-if-page-is-parent-or-child" title="Ha az oldal szülő vagy gyermek - CSS-trükkök" rel="bookmark">Ha az oldal szülő vagy gyermek - 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="/8004091-get-the-first-image-from-a-post" title="Szerezd meg az első képet egy bejegyzésből CSS-trükkök" rel="bookmark">Szerezd meg az első képet egy bejegyzésbő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="/8004092-loginlogout-and-user-welcome" title="Bejelentkezés / kijelentkezés és felhasználói üdvözlet - CSS-trükkök" rel="bookmark">Bejelentkezés / kijelentkezés és felhasználói üdvözlet - 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="/8004093-list-posts-highlight-current" title="Bejegyzések listája, Az aktuális kiemelése - CSS-trükkök" rel="bookmark">Bejegyzések listája, Az aktuális kiemelése - 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="/8004094-include-jquery-in-wordpress-theme" title="A jQuery szerepeltetése a WordPress témában - CSS-trükkök" rel="bookmark">A jQuery szerepeltetése a WordPress témában - 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="/8004095-natural-sort-using-post-meta-key" title="Természetes rendezés a Post használatával meta_key - CSS-trükkök" rel="bookmark">Természetes rendezés a Post használatával meta_key - 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="/8004096-move-wordpress-admin-bar-to-the-bottom" title="Mozgassa a WordPress adminisztrációs sávot az aljára - CSS-trükkök" rel="bookmark">Mozgassa a WordPress adminisztrációs sávot az aljára - CSS-trükkök</a></h3> </div> </div> </li> </ul> </div> <div id="container-5533149ee6411a5f99b370c693e87966"></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="/8225705-21-best-call-recorder-app-2021-update" title="21 BEST Call Recorder App (2021 frissítés)" rel="bookmark"><img src="https://cdn.css-code.org/9320246/21_best_call_recorder_app_2021_update.png.webp" loading="lazy" alt="21 BEST Call Recorder App (2021 frissítés)" title="21 BEST Call Recorder App (2021 frissítés)" 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="/8225705-21-best-call-recorder-app-2021-update" title="21 BEST Call Recorder App (2021 frissítés)" rel="bookmark">21 BEST Call Recorder App (2021 frissítés) 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="/8225706-25-best-photo-collage-maker-apps-in-2021" title="25 LEGJOBB Photo Collage Maker alkalmazás 2021-ben" rel="bookmark"><img src="https://cdn.css-code.org/4231233/25_best_photo_collage_maker_apps_in_2021.png.webp" loading="lazy" alt="25 LEGJOBB Photo Collage Maker alkalmazás 2021-ben" title="25 LEGJOBB Photo Collage Maker alkalmazás 2021-ben" 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="/8225706-25-best-photo-collage-maker-apps-in-2021" title="25 LEGJOBB Photo Collage Maker alkalmazás 2021-ben" rel="bookmark">25 LEGJOBB Photo Collage Maker alkalmazás 2021-ben 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="/8225707-30-best-language-learning-apps-freepaid-software" title="30 legjobb nyelvtanuló alkalmazás (ingyenes - fizetős szoftver)" rel="bookmark"><img src="https://cdn.css-code.org/6007741/30_best_language_learning_apps_free_paid_software.png.webp" loading="lazy" alt="30 legjobb nyelvtanuló alkalmazás (ingyenes - fizetős szoftver)" title="30 legjobb nyelvtanuló alkalmazás (ingyenes - fizetős szoftver)" 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="/8225707-30-best-language-learning-apps-freepaid-software" title="30 legjobb nyelvtanuló alkalmazás (ingyenes - fizetős szoftver)" rel="bookmark">30 legjobb nyelvtanuló alkalmazás (ingyenes - fizetős szoftver) 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="/8003237-15-chaining" title="# 15: Láncolás - CSS-trükkök" rel="bookmark"># 15: Láncolás - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003238-17-posting-with-ajax" title="# 17: POSTA az Ajax-szal - CSS-trükkök" rel="bookmark"># 17: POSTA az Ajax-szal - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003239-19-its-just-javascript" title="# 19: Ez csak a JavaScript - CSS-trükkök" rel="bookmark"># 19: Ez csak a JavaScript - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003241-22-the-need-for-templating" title="# 22: A sablonozás szükségessége - CSS-trükkök" rel="bookmark"># 22: A sablonozás szükségessége - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003242-21-just-change-classes" title="# 21: Csak váltson osztályt! - CSS-trükkök" rel="bookmark"># 21: Csak váltson osztályt! - CSS-trükkök</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="/8003049-text-decoration-style" title="Szövegdekorációs stílus - CSS-trükkök" rel="bookmark">Szövegdekorációs stílus - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003050-text-decoration-thickness" title="Szöveg-dekoráció-vastagság - CSS-trükkök" rel="bookmark">Szöveg-dekoráció-vastagság - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003051-text-combine-upright" title="Szöveg-össze-függőleges - CSS-trükkök" rel="bookmark">Szöveg-össze-függőleges - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003052-text-indent" title="Szöveg-francia - CSS-trükkök" rel="bookmark">Szöveg-francia - CSS-trükkök</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8003053-text-decoration-skip-ink" title="Text-decoration-skip-ink - CSS-trükkök" rel="bookmark">Text-decoration-skip-ink - CSS-trükkök</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="/8226463-hbase-create-table-with-example" title="HBase táblázat létrehozása példával" rel="bookmark">HBase táblázat létrehozása példával</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226464-insert-and-retrieve-data-in-hbase-get-put-scan-examples" title="& beszúrása Adatok lekérése a HBase-ben: get (), put (), scan () Példák" rel="bookmark">& beszúrása Adatok lekérése a HBase-ben: get (), put (), scan () Példák</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226465-top-30-hbase-interview-questions-and-answers" title="A 30 legfontosabb Hbase interjúkérdés & Válaszok" rel="bookmark">A 30 legfontosabb Hbase interjúkérdés & Válaszok</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226466-what-is-hive-architecture-and-modes" title="Mi a Hive? Építészet & Módok" rel="bookmark">Mi a Hive? Építészet & Módok</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226467-how-to-download-and-install-hive-on-ubuntu" title="Hogyan tölthet le & Telepítse a HIVE-t az Ubuntu-ra" rel="bookmark">Hogyan tölthet le & Telepítse a HIVE-t az Ubuntu-ra</a></h3> </div> </div> </li> </ul> </div> </div> </div> <p>© Copyright hu.css-code.org, 2025 Február | <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>