Krok 4
- W Firebug rozwiń tag , aby wyświetlić tag .</li>
<li>Kliknij wartość tagu <title> (czyli „Welcome: Mercury Tours”) i wklej ją w polu Target w Edytorze.</li>
</ul>
</td>
</tr>
<tr> <td><strong>Krok 5</strong>
<ul>
<li>Aby utworzyć trzecie polecenie, kliknij trzecią pustą linię w Edytorze i wpisz „typ” w polu tekstowym Polecenie.</li>
<li>W Firebug kliknij przycisk „Sprawdź”.</li>
</ul>
</td>
</tr>
<tr> <td>Kliknij pole tekstowe Nazwa użytkownika. Zauważ, że Firebug automatycznie wyświetla kod HTML dla tego elementu.</td>
</tr>
<tr> <td><strong>Krok 6</strong>
<p>Zwróć uwagę, że pole tekstowe Nazwa użytkownika nie ma identyfikatora, ale ma atrybut NAZWA. Będziemy zatem używać jego NAZWY jako lokalizatora. Skopiuj wartość NAME i wklej ją do pola Target w Selenium IDE.</p>
<p>Nadal w polu tekstowym Target przedrostek „nazwa_użytkownika” przedrostkiem „nazwa =”, co oznacza, że Selenium IDE powinno być skierowane na element, którego atrybut NAME to „nazwa_użytkownika”.</p>
<p>Wpisz „invalidUN” w polu tekstowym Wartość w Selenium IDE. Twój skrypt testowy powinien teraz wyglądać jak na poniższym obrazku. Skończyliśmy z trzecim poleceniem. Uwaga: Zamiast invalidUN, możesz wprowadzić dowolny inny ciąg tekstowy. Ale Selenium IDE rozróżnia wielkość liter i wpisujesz wartości / atrybuty dokładnie tak, jak w aplikacji.</p>
</td>
</tr>
<tr> <td><strong>Krok 7</strong>
<ul>
<li>Aby utworzyć czwarte polecenie, wpisz „typ” w polu tekstowym Polecenie.</li>
<li>Ponownie użyj przycisku „Sprawdź” Firebuga, aby uzyskać lokalizator pola tekstowego „Hasło”.</li>
</ul>
<ul>
<li>
<p>Wklej atrybut NAZWA („hasło”) do pola docelowego i poprzedz go ciągiem „nazwa =”</p>
</li>
<li>
<p>Wpisz „invalidPW” w polu Wartość w Selenium IDE. Twój skrypt testowy powinien teraz wyglądać jak na poniższym obrazku.</p>
</li>
</ul>
</td>
</tr>
<tr> <td><strong>Krok 8</strong>
<ul>
<li>W przypadku piątego polecenia wpisz „clickAndWait” w polu tekstowym Polecenie w środowisku Selenium IDE.</li>
<li>Użyj przycisku „Sprawdź” Firebuga, aby uzyskać lokalizator przycisku „Zaloguj się”.</li>
</ul>
<ul>
<li>Wklej wartość atrybutu NAZWA („login”) do pola tekstowego Cel i poprzedz go ciągiem „nazwa =”.</li>
<li>Twój skrypt testowy powinien teraz wyglądać jak na poniższym obrazku.</li>
</ul>
</td>
</tr>
</tbody>
</table>
<p><strong>Krok 9:</strong> Zapisz przypadek testowy w taki sam sposób, jak zrobiliśmy w poprzedniej sekcji.</p>
<a id="menu-6"></a>
<h2>Korzystanie z przycisku Znajdź</h2>
<p><strong>Przycisk Znajdź w Selenium IDE służy do sprawdzenia, czy to, co umieściliśmy w polu tekstowym Target, jest rzeczywiście poprawnym elementem interfejsu użytkownika.</strong></p>
<p>Skorzystajmy z przypadku testowego Invalid_login, który stworzyliśmy w poprzednich sekcjach. Kliknij dowolną komendę z pozycją Cel, powiedzmy trzecią komendą.</p>
<p>Kliknij przycisk Znajdź. Zwróć uwagę, że pole tekstowe Nazwa użytkownika na stronie Mercury Tours zostanie podświetlone na sekundę.</p>
<p>Oznacza to, że Selenium IDE było w stanie poprawnie wykryć i uzyskać dostęp do oczekiwanego elementu. Jeśli przycisk Znajdź podświetlił inny element lub nie podświetlił go wcale, oznacza to, że coś jest nie tak z Twoim skryptem.</p>
<a id="menu-7"></a>
<h2>Wykonaj polecenie</h2>
<p><strong>Pozwala to na wykonanie dowolnego polecenia bez uruchamiania całego przypadku testowego</strong> . Po prostu kliknij linię, którą chcesz wykonać, a następnie kliknij „Działania> Wykonaj to polecenie” na pasku menu lub po prostu naciśnij „X” na klawiaturze.</p>
<p><strong>Krok 1.</strong> Upewnij się, że Twoja przeglądarka znajduje się na stronie głównej Mercury Tours. Kliknij polecenie, które chcesz wykonać. W tym przykładzie kliknij wiersz „typ | nazwa_użytkownika | nieprawidłowyUN”.</p>
<p><strong>Krok 2.</strong> Naciśnij „X” na klawiaturze.</p>
<p><strong>Krok 3.</strong> Zwróć uwagę, że pole tekstowe nazwy użytkownika zostanie wypełnione tekstem „invalidUN”</p>
<p><strong>Wykonywanie poleceń w ten sposób zależy w dużym stopniu od strony, którą Firefox aktualnie wyświetla</strong> . Oznacza to, że jeśli wypróbujesz powyższy przykład ze stroną główną Google wyświetloną zamiast Mercury Tours ', twój krok nie powiedzie się, ponieważ na stronie głównej Google nie ma pola tekstowego z atrybutem „nazwa_użytkownika”.</p>
<a id="menu-8"></a>
<h2>Punkt startu</h2>
<p><strong>Punkt początkowy to wskaźnik, który informuje Selenium IDE, w których wierszach rozpocznie się wykonanie</strong> . <strong>Jego klawisz skrótu to „S”.</strong></p>
<p>W powyższym przykładzie odtwarzanie rozpocznie się w trzeciej linii (wpisz | hasło | nieprawidłowyPW). <strong>W jednym skrypcie testowym możesz mieć tylko jeden punkt początkowy.</strong></p>
<p>Punkt początkowy jest podobny do polecenia Wykonaj polecenie, ponieważ jest zależny od aktualnie wyświetlanej strony. Punkt początkowy nie powiedzie się, jeśli jesteś na niewłaściwej stronie.</p>
<a id="menu-9"></a>
<h2>Punkty przerwania</h2>
<p>Punkty przerwania to wskaźniki, które informują Selenium IDE, gdzie automatycznie wstrzymać test. <strong>Klawisz skrótu to „B”.</strong></p>
<p>Żółte podświetlenie oznacza, że bieżący krok jest w toku. Dowodzi to, że Selenium IDE wstrzymało wykonywanie na tym kroku. <strong>W jednym przypadku testowym możesz mieć wiele punktów przerwania.</strong></p>
<a id="menu-10"></a>
<h2>Krok</h2>
<p>Pozwala na wykonywanie kolejnych poleceń pojedynczo po wstrzymaniu przypadku testowego. Skorzystajmy ze scenariusza z poprzedniej sekcji „Punkty przerwania”.</p>
<table>
<tbody>
<tr> <td width="50%"> </td> <td>
<p><strong>Przed kliknięciem „Krok”.</strong></p>
<p>Przypadek testowy zatrzymuje się w wierszu „clickAndWait | login”.</p>
</td>
</tr>
<tr> <td width="50%"> </td> <td>
<p><strong>Po kliknięciu „Krok”.</strong></p>
<p>Wiersz „clickAndWait | login” jest uruchamiany i zatrzymuje się na następnym poleceniu (verifyTitle | Sign-on: Mercury Tours).</p>
<p>Zauważ, że następna linia jest wstrzymana, mimo że nie ma tam punktu przerwania. Jest to główny cel funkcji Step - wykonuje kolejne polecenia pojedynczo, aby dać Ci więcej czasu na sprawdzenie wyniku po każdym kroku.</p>
</td>
</tr>
</tbody>
</table>
<a id="menu-11"></a>
<h2>Ważne rzeczy, o których należy pamiętać podczas używania innych formatów w widoku źródła</h2>
<p><strong>Selenium IDE działa dobrze tylko z HTML - inne formaty są nadal w trybie eksperymentalnym</strong> . To <strong>nie jest wskazane</strong> , aby utworzyć lub edytować testy przy użyciu innych formatów w tekst źródłowy, ponieważ jest jeszcze wiele pracy potrzeba, aby to stabilne. Poniżej znajdują się znane błędy z wersji 1.9.1.</p>
<ul>
<li>Nie będziesz w stanie odtworzyć ani przełączyć się z powrotem do widoku tabeli, chyba że powrócisz do HTML.</li>
<li>Jedynym sposobem na bezpieczne dodawanie poleceń do kodu źródłowego jest ich nagranie.</li>
<li>Gdy ręcznie zmodyfikujesz kod źródłowy, wszystko to zostanie utracone po przełączeniu się na inny format.</li>
<li>Chociaż możesz zapisać swój przypadek testowy w widoku źródła, Selenium IDE nie będzie w stanie go otworzyć.</li>
</ul>
<p><strong>Zalecanym sposobem konwersji testów Selenese jest użycie opcji „Eksportuj przypadek testowy jako…” w menu Plik, a nie w widoku źródła.</strong></p>
<a id="menu-12"></a>
<h2>Podsumowanie</h2>
<ul>
<li>Skrypty testowe można tworzyć poprzez nagrywanie lub ręczne wpisywanie poleceń i parametrów.</li>
<li>Podczas ręcznego tworzenia skryptów do pobrania lokalizatora używany jest Firebug.</li>
<li>Przycisk Znajdź służy do sprawdzenia, czy polecenie ma dostęp do właściwego elementu.</li>
<li>Widok tabeli wyświetla skrypt testowy w formie tabelarycznej, podczas gdy widok źródła wyświetla go w formacie HTML.</li>
<li>Zmiana widoku źródła na format inny niż HTML jest nadal eksperymentalna.</li>
<li>Nie używaj widoku źródła do tworzenia testów w innych formatach. Zamiast tego użyj funkcji eksportu.</li>
<li>Parametry nie są wymagane przez cały czas. To zależy od polecenia.</li>
<li>Istnieją trzy rodzaje poleceń:</li>
<ul>
<li>Akcje - bezpośrednio współdziała z elementami strony</li>
<li>Accessors - „czyta” właściwość elementu i zapisuje ją w zmiennej</li>
<li>Assertions - porównuje rzeczywistą wartość z oczekiwaną</li>
</ul>
<li>Asercje mają trzy typy:</li>
<ul>
<li>Assert - w przypadku niepowodzenia kolejne kroki nie są już wykonywane</li>
<li>Weryfikuj - w przypadku niepowodzenia kolejne kroki są nadal wykonywane.</li>
<li>WaitFor - przechodzi, jeśli określony warunek stanie się prawdziwy w określonym czasie; w przeciwnym razie nie powiedzie się</li>
</ul>
<li>Najpopularniejsze polecenia to:</li>
<ul>
<li>otwarty</li>
<li>click / clickAndWait</li>
<li>type / typeKeys</li>
<li>verifyTitle / assertTitle</li>
<li>verifyTextPresent</li>
<li>verifyElementPresent</li>
<li>verifyTable</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">Popularne Wiadomości</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="/8003928-create-url-slug-from-post-title" title="Utwórz informacje o błędzie adresu URL z tytułu posta - CSS-Tricks" rel="bookmark"><img src="https://cdn.css-code.org/1047287/create_url_slug_from_post_title_css-tricks.png.webp" loading="lazy" alt="Utwórz informacje o błędzie adresu URL z tytułu posta - CSS-Tricks" title="Utwórz informacje o błędzie adresu URL z tytułu posta - CSS-Tricks" 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="/8003928-create-url-slug-from-post-title" title="Utwórz informacje o błędzie adresu URL z tytułu posta - CSS-Tricks" rel="bookmark">Utwórz informacje o błędzie adresu URL z tytułu posta - CSS-Tricks 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="/8003929-detect-location-by-ip" title="Wykryj lokalizację według adresu IP - CSS-Tricks" rel="bookmark"><img src="https://cdn.css-code.org/8002714/detect_location_by_ip_css-tricks.png.webp" loading="lazy" alt="Wykryj lokalizację według adresu IP - CSS-Tricks" title="Wykryj lokalizację według adresu IP - CSS-Tricks" 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="/8003929-detect-location-by-ip" title="Wykryj lokalizację według adresu IP - CSS-Tricks" rel="bookmark">Wykryj lokalizację według adresu IP - CSS-Tricks 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="/8003930-discover-and-display-meta-tags" title="Odkryj i wyświetl metatagi - CSS-Tricks" rel="bookmark"><img src="https://cdn.css-code.org/5959717/discover_and_display_meta_tags_css-tricks.png.webp" loading="lazy" alt="Odkryj i wyświetl metatagi - CSS-Tricks" title="Odkryj i wyświetl metatagi - CSS-Tricks" 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="/8003930-discover-and-display-meta-tags" title="Odkryj i wyświetl metatagi - CSS-Tricks" rel="bookmark">Odkryj i wyświetl metatagi - CSS-Tricks 2025</a></h3>
</div>
</div>
</li>
</ul>
</div>
<div class="widget widget-popular-posts">
<h2 class="widget-title">Najlepsze opinii o miesiąc</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="/8222980-how-to-download-and-install-selenium-ide-for-firefox" title="Jak pobrać & Zainstaluj Selenium IDE dla przeglądarki Firefox" rel="bookmark">Jak pobrać & Zainstaluj Selenium IDE dla przeglądarki Firefox</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="/8222981-selenium-ide-tutorial-for-beginners" title="Samouczek Selenium IDE dla początkujących" rel="bookmark">Samouczek Selenium IDE dla początkujących</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="/8222982-verify-element-present-waitfor-andwait-in-selenium-ide" title="Zweryfikuj obecny element, czekaj na i czekaj w środowisku Selenium IDE" rel="bookmark">Zweryfikuj obecny element, czekaj na i czekaj w środowisku Selenium IDE</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="/8222983-store-variables-echo-alert-popup-handling-in-selenium-ide" title="Przechowuj zmienne, echo, alarm, obsługa PopUp w Selenium IDE" rel="bookmark">Przechowuj zmienne, echo, alarm, obsługa PopUp w Selenium IDE</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="/8222984-how-to-use-selenium-ide-with-scripts-and-commands-assert-verify" title="Jak używać Selenium IDE ze skryptami & Polecenia (potwierdź, zweryfikuj)" rel="bookmark">Jak używać Selenium IDE ze skryptami & Polecenia (potwierdź, zweryfikuj)</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="/8222985-how-to-debug-in-selenium-ide-breakpoint-and-start-point" title="Jak debugować w Selenium IDE - Punkt przerwania & Punkt startu" rel="bookmark">Jak debugować w Selenium IDE - Punkt przerwania & Punkt startu</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="/8222986-selenium-with-cucumber-bdd-framework-tutorial-with-example" title="Selen with Cucumber (BDD Framework): samouczek z przykładem" rel="bookmark">Selen with Cucumber (BDD Framework): samouczek z przykładem</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="/8222987-maximize-browser-in-selenium" title="Zmaksymalizuj przeglądarkę w Selenium" rel="bookmark">Zmaksymalizuj przeglądarkę w Selenium</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="/8222988-selenium-core-extensions-user-extensions-js" title="Rozszerzenia Selenium Core (User-Extensions.js)" rel="bookmark">Rozszerzenia Selenium Core (User-Extensions.js)</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="/8222989-chrome-options-and-desiredcapabilities-adblocker-incognito-headless" title="Opcje Chrome & Pożądane możliwości: AdBlocker, Incognito, Headless" rel="bookmark">Opcje Chrome & Pożądane możliwości: AdBlocker, Incognito, Headless</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="/8222990-refresh-page-using-selenium-webdriver" title="Odśwież stronę używając Selenium Webdriver" rel="bookmark">Odśwież stronę używając Selenium Webdriver</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="/8222991-uft-vs-selenium-difference-between-selenium-and-hp-uft" title="UFT vs Selen: różnica między selenem a HP UFT" rel="bookmark">UFT vs Selen: różnica między selenem a HP UFT</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="/8222992-top-100-selenium-interview-questions-and-answers" title="100 najpopularniejszych pytań i odpowiedzi do wywiadu dotyczącego selenu" rel="bookmark">100 najpopularniejszych pytań i odpowiedzi do wywiadu dotyczącego selenu</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="/8222993-using-excel-vba-and-selenium" title="Korzystanie z Excel VBA i Selenium" rel="bookmark">Korzystanie z Excel VBA i Selenium</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="/8222994-10-best-imacros-alternatives-in-2021" title="10 najlepszych alternatyw iMacros w 2021 roku" rel="bookmark">10 najlepszych alternatyw iMacros w 2021 roku</a></h3>
</div>
</div>
</li>
</ul>
</div>
<div id="container-5533149ee6411a5f99b370c693e87966"></div> <div class="widget widget-popular-posts">
<h2 class="widget-title">Najpopularniejsze Artykuły</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="/8225180-python-vs-javascript-whats-the-difference" title="Python kontra JavaScript: jaka jest różnica?" rel="bookmark"><img src="https://cdn.css-code.org/2447429/python_vs_javascript_whats_the_difference_.png.webp" loading="lazy" alt="Python kontra JavaScript: jaka jest różnica?" title="Python kontra JavaScript: jaka jest różnica?" 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="/8225180-python-vs-javascript-whats-the-difference" title="Python kontra JavaScript: jaka jest różnica?" rel="bookmark">Python kontra JavaScript: jaka jest różnica? 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="/8225181-python-vs-ruby-whats-the-difference" title="Python kontra Ruby: jaka jest różnica?" rel="bookmark"><img src="https://cdn.css-code.org/https://www.guru99.com/images/1/021020_0523_PythonvsRub1.png.webp>" loading="lazy" alt="Python kontra Ruby: jaka jest różnica?" title="Python kontra Ruby: jaka jest różnica?" 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="/8225181-python-vs-ruby-whats-the-difference" title="Python kontra Ruby: jaka jest różnica?" rel="bookmark">Python kontra Ruby: jaka jest różnica? 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="/8225182-python-vs-java-vs-php-vs-perl-vs-ruby-vs-javascript-vs-c-vs-tcl" title="Python vs JAVA vs PHP vs PERL vs Ruby vs JavaScript vs C ++ vs TCL" rel="bookmark"><img src="https://cdn.css-code.org/9237994/python_vs_java_vs_php_vs_perl_vs_ruby_vs_javascript_vs_c_vs_tcl.png.webp" loading="lazy" alt="Python vs JAVA vs PHP vs PERL vs Ruby vs JavaScript vs C ++ vs TCL" title="Python vs JAVA vs PHP vs PERL vs Ruby vs JavaScript vs C ++ vs TCL" 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="/8225182-python-vs-java-vs-php-vs-perl-vs-ruby-vs-javascript-vs-c-vs-tcl" title="Python vs JAVA vs PHP vs PERL vs Ruby vs JavaScript vs C ++ vs TCL" rel="bookmark">Python vs JAVA vs PHP vs PERL vs Ruby vs JavaScript vs C ++ vs TCL 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">Popularne Wiadomości</h2>
<ul class="post-list-small">
<li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004002-time-ago-function" title="Funkcja Time Ago - CSS-Tricks" rel="bookmark">Funkcja Time Ago - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004003-options-to-truncate-strings" title="Opcje obcinania ciągów - CSS-Tricks" rel="bookmark">Opcje obcinania ciągów - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004004-update-values-of-entire-table" title="Zaktualizuj wartości całej tabeli - CSS-Tricks" rel="bookmark">Zaktualizuj wartości całej tabeli - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004005-url-validation" title="Walidacja adresu URL - CSS-Tricks" rel="bookmark">Walidacja adresu URL - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004006-simple-zipcode-range-tester" title="Prosty tester zakresu kodów pocztowych - CSS-Tricks" rel="bookmark">Prosty tester zakresu kodów pocztowych - CSS-Tricks</a></h3>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="widget">
<h2 class="widget-title">Wybór Redakcji</h2>
<ul class="post-list-small">
<li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8003783-trim-firstlast-characters-in-string" title="Przytnij pierwsze / ostatnie znaki w ciągu - CSS-Tricks" rel="bookmark">Przytnij pierwsze / ostatnie znaki w ciągu - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8003784-word-count-bookmarklet" title="Zakładka z licznikiem słów - CSS-Tricks" rel="bookmark">Zakładka z licznikiem słów - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8003785-viewport-size-screen-resolution-mouse-postition" title="Rozmiar widocznego obszaru, rozdzielczość ekranu, pozycja myszy - CSS-Tricks" rel="bookmark">Rozmiar widocznego obszaru, rozdzielczość ekranu, pozycja myszy - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8003786-add-active-navigation-class-based-on-url" title="Dodaj klasę aktywnej nawigacji na podstawie adresu URL - CSS-Tricks" rel="bookmark">Dodaj klasę aktywnej nawigacji na podstawie adresu URL - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8003787-addingremoving-class-on-hover" title="Dodawanie / usuwanie klasy po najechaniu kursorem - CSS-Tricks" rel="bookmark">Dodawanie / usuwanie klasy po najechaniu kursorem - CSS-Tricks</a></h3>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="col-lg-4">
<div class="widget">
<h2 class="widget-title">Najpopularniejsze Artykuły</h2>
<ul class="post-list-small">
<li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004047-shape-morphing-icons-in-button-on-click" title="Ikony morfowania kształtów w przycisku po kliknięciu - CSS-Tricks" rel="bookmark">Ikony morfowania kształtów w przycisku po kliknięciu - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004048-svg-patterns" title="Wzory SVG - CSS-Tricks" rel="bookmark">Wzory SVG - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004049-add-category-name-to-body-class" title="Dodaj nazwę kategorii do body_class - CSS-Tricks" rel="bookmark">Dodaj nazwę kategorii do body_class - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004050-curved-text-along-a-path" title="Zakrzywiony tekst wzdłuż ścieżki - CSS-Tricks" rel="bookmark">Zakrzywiony tekst wzdłuż ścieżki - CSS-Tricks</a></h3>
</div>
</div>
</li><li class="post-list-small__item">
<div>
<div>
<h3 class="post-list-small__entry-title"><a href="/8004051-adobe-illustrator-export-options" title="Opcje eksportu do programu Adobe Illustrator - CSS-Tricks" rel="bookmark">Opcje eksportu do programu Adobe Illustrator - CSS-Tricks</a></h3>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<p>© Copyright pl.css-code.org, 2025 Sierpień |
<a href="https://pl.css-code.org/about-site" title="O stronie">O stronie</a> |
<a href="https://pl.css-code.org/contacts" title="Łączność">Łączność</a> |
<a href="https://pl.css-code.org/privacy-policy" title="Polityka prywatności">Polityka prywatności</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>
|
