Element
jest kluczowym składnikiem sekcji <head> każdego dokumentu HTML5, ponieważ definiuje tytuł strony, który jest wyświetlany w pasku tytułowym przeglądarki oraz w wynikach wyszukiwania. Zgodnie z wytycznymi W3C, element <title> jest wymagany, co oznacza, że każda poprawna struktura dokumentu HTML5 musi go zawierać. Przykład poprawnej implementacji to: <head><title>Mój dokument. Brak elementumoże prowadzić do niższej oceny SEO, ponieważ wyszukiwarki używają tego tytułu jako kluczowej informacji o zawartości strony. Dla deweloperów istotne jest, aby tytuł był krótki, ale zwięzły, dostarczający jasnych informacji o tematyce strony. Ponadto, dobrze skonstruowany tytuł może przyciągać użytkowników, co ma kluczowe znaczenie w kontekście UX i marketingu internetowego. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 26</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="wbudowanym-w-pakiet-xampp-narzedziem-suzacym-do-z-5256ee66" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Narzędziem do zarządzania bazą danych wbudowanym w pakiet XAMPP jest</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>A. phpMyAdmin</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. pgAdmin</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. SQLite</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. MySQL Workbench</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> phpMyAdmin to popularne narzędzie webowe, które jest częścią pakietu XAMPP, służące do zarządzania bazami danych MySQL. Umożliwia użytkownikom interakcję z bazą danych poprzez intuicyjny interfejs graficzny, co znacznie upraszcza wykonanie operacji takich jak tworzenie, edytowanie i usuwanie baz danych oraz tabel. Dzięki phpMyAdmin można z łatwością zarządzać uprawnieniami użytkowników, importować i eksportować dane, a także wykonywać zapytania SQL bez konieczności korzystania z linii poleceń. To narzędzie jest szczególnie przydatne dla osób, które nie mają doświadczenia w pracy z bazami danych, a jego dostępność w XAMPP czyni go idealnym rozwiązaniem dla programistów webowych i administratorów systemów. W praktyce, phpMyAdmin wspiera wiele standardów, takich jak UTF-8, co zapewnia poprawne przetwarzanie danych w różnych językach. Warto zaznaczyć, że korzystanie z phpMyAdmin jest zgodne z najlepszymi praktykami w zakresie zarządzania bazami danych, ponieważ umożliwia skuteczne monitorowanie i optymalizację wydajności bazy danych. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 27</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="fragment-kodu-jezyku-php-ma-nastepujaca-postac-wy-f92918d4" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Poniżej przedstawiono fragment kodu w języku PHP. Jakie liczby wypisze ta pętla jako wynik swojego działania?<table style="border: 2px solid black; border-collapse: collapse;"><tr><td style="border: 1px solid black; padding: 10px; font-family: monospace;"><span style="color: blue;">for</span> (<span style="color: green;">$i = 0</span>; <span style="color: green;">$i <= 20</span>; <span style="color: green;">$i += 4</span>)<br><span style="color: blue;">echo</span> <span style="color: green;">$i</span> . <span style="color: brown;">' '</span>;</td></tr></table></p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. 0,4,8,12,16</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>B. 0,4,8,12,16,20</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. 0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. 0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Pętla for w PHP działa tak, że zaczyna od 0 i leci aż do 20, dodając 4 przy każdej iteracji. Dzięki temu, dostajemy liczby 0, 4, 8, 12, 16 i 20. To jest naprawdę przydatne, zwłaszcza gdy chcemy przetwarzać co czwarty element w zbiorze. Pętle for są bardzo popularne w programowaniu, bo pozwalają robić rzeczy wielokrotnie bez zbędnego powtarzania kodu. Jeśli zrozumiesz, jak to działa, to potem dużo łatwiej będzie Ci pisać różne programy. Z moich doświadczeń wynika, że lepiej jest unikać tzw. magicznych liczb w kodzie, czyli takich, które nie mają sensownego wyjaśnienia. Lepiej używać stałych czy zmiennych, bo to sprawia, że kod jest bardziej czytelny i łatwiejszy do ogarnięcia w przyszłości. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 28</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-jezyku-php-funkcja-trim-ma-za-zadanie-57cceb42" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>W PHP funkcja trim służy do</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. porównywania dwóch tekstów i wyświetlania ich części wspólnej</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>B. usuwania białych znaków lub innych znaków wymienionych w parametrze z obu końców tekstu</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. podawania długości tekstu</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. redukcji tekstu o liczbę znaków określoną w parametrze</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Funkcja trim w języku PHP jest używana do usuwania białych znaków z początku i końca ciągu znaków. Oprócz znaków białych, użytkownik może również określić inne znaki, które mają być usunięte, poprzez podanie ich jako drugi parametr funkcji. Jest to szczególnie przydatne w sytuacjach, gdy dane wejściowe pochodzą od użytkowników i mogą zawierać niechciane spacje lub znaki interpunkcyjne na początku lub końcu tekstu. Przykładowo, jeśli mamy napis ' Hello World! ', użycie funkcji trim w formie trim(' Hello World! ') zwróci 'Hello World!'. Funkcja ta jest zgodna z dokumentacją PHP i jej działanie można znaleźć w standardowych materiałach dotyczących obsługi stringów. Usuwanie białych znaków jest kluczowym krokiem w procesie sanitizacji danych i przygotowywaniu ich do dalszej obróbki, na przykład w bazach danych lub przy zestawianiu danych z różnych źródeł. Warto również wspomnieć, że istnieją pokrewne funkcje, takie jak ltrim i rtrim, które odpowiednio usuwają znaki tylko z lewej lub prawej strony łańcucha. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 29</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-jezyku-javascript-podany-w-ramce-fragment-funkc-989b4e1d" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>W języku JavaScript zamieszczony poniżej fragment funkcji ma na celu</p> <figure class="figure mt-3"> <img src="/images/11165.png" class="figure-img img-fluid rounded" alt="Ilustracja do pytania" itemprop="image"> </figure> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. wprowadzenie do każdego elementu tablicy bieżącej wartości zmiennej i</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. dodanie stałej wartości do każdego elementu tablicy</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>C. policzenie sumy wszystkich elementów tablicy</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. wyświetlenie wszystkich elementów tablicy</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Podany fragment kodu w języku JavaScript pokazuje klasyczną strukturę pętli for, która pozwala na przejście przez wszystkie elementy tablicy i wykonanie na nich określonych operacji. W tym przypadku celem pętli jest zsumowanie wszystkich elementów tablicy. Zmienna wynik jest inicjalizowana wartością 0, co jest dobrą praktyką programistyczną, aby zapewnić prawidłowe działanie sumowania. Pętla iteruje przez każdy element tablicy tab przy pomocy zmiennej i, która pełni rolę indeksu. Przy każdej iteracji do zmiennej wynik dodawana jest wartość bieżącego elementu tablicy tab[i]. Po zakończeniu pętli zmienna wynik będzie zawierać sumę wszystkich elementów tablicy. Takie podejście jest podstawą wielu algorytmów przetwarzających dane tablicowe i ilustruje ważny koncept iteracyjnego przetwarzania danych. Warto również wspomnieć, że takie podstawowe operacje jak to sumowanie mogą być zastosowane w wielu dziedzinach takich jak analiza danych obliczenia statystyczne czy przetwarzanie dużych zbiorów danych w systemach komputerowych co czyni je niezwykle wartościowymi w praktyce zawodowej </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 30</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="do-tabeli-pracownicy-wpisano-rekordy-co-zostanie-5e262f4f" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Jakie wyniki zostaną wyświetlone po wykonaniu podanej w ramce kwerendy SQL SELECT na tabeli pracownicy, która zawiera rekordy? <!-- Tabela danych --> <table style="border-collapse: collapse; font-family: sans-serif; margin-bottom: 20px;"> <tr style="background-color: #f0f0f0;"> <th style="border: 1px solid #ccc; padding: 6px;">id</th> <th style="border: 1px solid #ccc; padding: 6px;">imie</th> <th style="border: 1px solid #ccc; padding: 6px;">nazwisko</th> <th style="border: 1px solid #ccc; padding: 6px;">pensja</th> </tr> <tr> <td style="border: 1px solid #ccc; padding: 6px;">1</td> <td style="border: 1px solid #ccc; padding: 6px;">Anna</td> <td style="border: 1px solid #ccc; padding: 6px;">Kowalska</td> <td style="border: 1px solid #ccc; padding: 6px;">3400</td> </tr> <tr style="background-color: #f9f9f9;"> <td style="border: 1px solid #ccc; padding: 6px;">2</td> <td style="border: 1px solid #ccc; padding: 6px;">Monika</td> <td style="border: 1px solid #ccc; padding: 6px;">Nowak</td> <td style="border: 1px solid #ccc; padding: 6px;">1300</td> </tr> <tr> <td style="border: 1px solid #ccc; padding: 6px;">3</td> <td style="border: 1px solid #ccc; padding: 6px;">Ewelina</td> <td style="border: 1px solid #ccc; padding: 6px;">Nowakowska</td> <td style="border: 1px solid #ccc; padding: 6px;">2600</td> </tr> <tr style="background-color: #f9f9f9;"> <td style="border: 1px solid #ccc; padding: 6px;">4</td> <td style="border: 1px solid #ccc; padding: 6px;">Anna</td> <td style="border: 1px solid #ccc; padding: 6px;">Przybylska</td> <td style="border: 1px solid #ccc; padding: 6px;">4600</td> </tr> <tr> <td style="border: 1px solid #ccc; padding: 6px;">5</td> <td style="border: 1px solid #ccc; padding: 6px;">Maria</td> <td style="border: 1px solid #ccc; padding: 6px;">Kowal</td> <td style="border: 1px solid #ccc; padding: 6px;">2200</td> </tr> <tr style="background-color: #f9f9f9;"> <td style="border: 1px solid #ccc; padding: 6px;">6</td> <td style="border: 1px solid #ccc; padding: 6px;">Ewa</td> <td style="border: 1px solid #ccc; padding: 6px;">Nowacka</td> <td style="border: 1px solid #ccc; padding: 6px;">5400</td> </tr> </table> <!-- Ramka z zapytaniem SQL --> <pre style="font-family: monospace; border: 1px solid #000; padding: 10px; display: inline-block;"> SELECT SUM(pensja) FROM pracownicy WHERE pensja > 4000; </pre></p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>A. Kwota 10000, co stanowi sumę pensji pracowników o id=4 i id=6</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. Kwota 19500, czyli suma wszystkich pensji zatrudnionych</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. Dwie kwoty: 4600 oraz 5400, jako wynagrodzenia pracowników przekraczające 4000</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. Kwota 5400, co oznacza najwyższą pensję wśród pracowników</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> W zapytaniu SQL użyto funkcji agregującej SUM, która służy do sumowania wartości w określonej kolumnie. Klauzula WHERE ogranicza zbiór rekordów do tych, które spełniają dany warunek. W tym przypadku, pensja musi być większa niż 4000. Analizując tabelę, znajdujemy dwie osoby z pensjami spełniającymi ten warunek: pracownik o id=4 z pensją 4600 oraz pracownik o id=6 z pensją 5400. SUM(4600 + 5400) daje 10000. Prawidłowe zrozumienie wykorzystania funkcji agregujących w SQL jest kluczowe w analizie danych i raportowaniu. Jest to standardowa praktyka w branży IT, gdzie analiza danych jest podstawą przy podejmowaniu decyzji biznesowych. Funkcje agregujące, takie jak SUM, AVG, MAX, są fundamentalnymi narzędziami analitycznymi w bazach danych. Przy pracy nad większymi zbiorami danych, takie zapytania pomagają szybko uzyskać podsumowania, co jest nieocenione w analizie finansowej czy tworzeniu raportów zarządczych. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 31</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-jezyku-css-wartosci-underline-overline-blink-fd4be4af" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>W CSS wartości: underline, overline, blink są powiązane z atrybutem</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. font-style</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-danger bg-opacity-10 border-danger text-danger "> <div class="flex-grow-1"> <span>B. text-style</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. font-weight</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>D. text-decoration</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-danger mb-0"> Atrybut text-style to w zasadzie fikcja w CSS, bo takiego czegoś po prostu nie ma w specyfikacji. Owszem, CSS daje nam różne opcje do stylizacji tekstu, ale text-style to nie jest jedna z nich. Lepiej skupić się na text-decoration, font-style czy font-weight, bo to już są realne właściwości. Na przykład, font-style pozwala wybrać styl czcionki, jak normal, italic albo oblique, ale nie zrobisz tym efektów dekoracyjnych, takich jak podkreślenie czy nadkreslenie. Z kolei font-weight dotyczy grubości czcionki, ale też nie ma nic wspólnego z dekoracją tekstu. Wartości, które tam znajdziesz, jak normal, bold czy bolder, odnoszą się raczej do samego kroju pisma. Więc jeśli chodzi o dekorację, to musisz używać text-decoration, bo to właśnie do tego zostało stworzone, a inne właściwości mają zupełnie inne zastosowania. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 32</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="jak-nazywa-sie-element-bazy-danych-za-pomoca-kto-53877098" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Jakie jest określenie na element bazy danych, który umożliwia jedynie przeglądanie danych, przedstawiając je w formie tekstowej lub graficznej?</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>A. Raport</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. Formularz</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. Zapytanie</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. Tabela</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Raport to element bazy danych, który umożliwia użytkownikom jedynie odczytywanie danych i prezentowanie ich w przystępnej formie, takiej jak tekst lub wykres. Kluczowym aspektem raportu jest jego zdolność do agregowania informacji pochodzących z różnych źródeł w bazie danych, co umożliwia generowanie syntetycznych przeglądów i analiz danych. Na przykład, w systemach zarządzania relacyjnymi bazami danych, takich jak Microsoft SQL Server, można stworzyć raport, który zbiera dane sprzedażowe z różnych tabel, a następnie prezentuje je w formie graficznej, co ułatwia interpretację wyników. Raporty są często używane w kontekście raportowania biznesowego, gdzie kluczowe jest przedstawienie danych w sposób zrozumiały dla decydentów. Standardy, takie jak SQL, umożliwiają tworzenie zapytań, które generują dane do raportów, a narzędzia takie jak Crystal Reports czy Microsoft Power BI wspierają ich wizualizację. Dzięki temu raporty stają się niezbędnym narzędziem w analizie danych i podejmowaniu strategicznych decyzji. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 33</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-html-aby-wstawic-obrazek-z-tekstem-przylegym-3139dccc" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>W HTML, aby dodać obrazek z tekstem umieszczonym pośrodku obrazka, konieczne jest użycie znacznika</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. <img src="obrazek.png" alt="obraz1" hspace="30px"> tekst</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. <img src="obrazek.png" alt="obraz3" height="50%"> tekst</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. <img src="obrazek.png" alt="obraz4"> tekst</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>D. <img src="obrazek.png" alt="obraz2" align="middle"> tekst</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź <img src="obrazek.png" alt="obraz2" align="middle"> tekst jest prawidłowa, ponieważ wykorzystuje atrybut align z wartością middle, który umożliwia wyśrodkowanie tekstu w poziomie w stosunku do obrazka. Zgodnie z HTML 4.01, atrybut align pozwala na określenie, jak elementy są położone względem siebie, a w tym przypadku sprawia, że tekst pojawia się pośrodku obrazka, co jest często pożądanym efektem wizualnym. W praktyce, użycie takiego podejścia jest przydatne szczególnie w tworzeniu estetycznych i czytelnych układów, gdzie obrazki ilustrują konkretne treści. Warto jednak zauważyć, że w nowoczesnym HTML oraz w CSS rekomenduje się stosowanie bardziej zaawansowanych metod stylizacji, takich jak Flexbox lub Grid, które umożliwiają bardziej elastyczne i responsywne projektowanie stron internetowych. Na przykład, można użyć CSS do osiągnięcia podobnego efektu, co sprawia, że kod HTML jest czystszy i bardziej zgodny z aktualnymi standardami. Zastosowanie arkuszy stylów do zarządzania układem i prezentacją treści zwiększa również dostępność i ułatwia zarządzanie projektem. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 34</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="za-pomoca-ktorego-ograniczenia-constraint-mozna-64a5c2ce" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Jakiego ograniczenia (constraint) używa się do zdefiniowania klucza obcego?</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. UNIQUE KEY(ID)</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>B. FOREIGN KEY(ID)</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. PRIMARY KEY(ID)</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. AUTO_INCREMENT(ID)</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź 'FOREIGN KEY(ID)' jest poprawna, ponieważ klucz obcy służy do definiowania relacji między tabelami w bazach danych. Klucz obcy to atrybut lub zestaw atrybutów w jednej tabeli, który odnosi się do klucza głównego innej tabeli. Przykładowo, w bazie danych, która obsługuje system zarządzania zamówieniami, tabela 'Zamówienia' może zawierać kolumnę 'KlientID', będącą kluczem obcym odnoszącym się do kolumny 'ID' w tabeli 'Klienci'. Użycie kluczy obcych pozwala na zapewnienie integralności referencyjnej, co oznacza, że każdy wpis w tabeli 'Zamówienia' musi odpowiadać istniejącemu klientowi w tabeli 'Klienci'. Dobrym praktykom w projektowaniu baz danych jest stosowanie kluczy obcych jako sposobu na unikanie niezgodności danych oraz na umożliwienie wykonywania zapytań z wykorzystaniem JOIN, co ułatwia uzyskiwanie skonsolidowanych informacji z różnych tabel. Ponadto, w przypadku usunięcia lub aktualizacji rekordów w tabeli źródłowej, można skonfigurować odpowiednie zasady, takie jak 'CASCADE', które automatycznie zaktualizują powiązane dane w tabeli docelowej, co jest istotne dla zachowania spójności danych. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 35</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="do-grupowania-obszarow-na-poziomie-blokow-ktore-fcb51af7" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Aby grupować sekcje na poziomie bloków, które będą stilizowane za pomocą znaczników, jakiego należy użyć?</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. <span></span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. <param></span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>C. <div></span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. <p></span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Znak <div> jest jednym z podstawowych elementów HTML, który służy do grupowania i organizowania zawartości w dokumentach HTML. Umożliwia on stosowanie stylów CSS oraz skryptów JavaScript na grupach elementów, co czyni go niezwykle użytecznym w budowie responsywnych i złożonych układów stron. W przeciwieństwie do znaku <p>, który zarezerwowany jest dla akapitów tekstu, lub <span>, który jest używany do izolowania niewielkich fragmentów tekstu w ramach większego kontekstu, <div> działa jako kontener wypełniający swoje otoczenie. Ponadto, <div> jest znacznikiem blokowym, co oznacza, że zajmuje całą szerokość dostępnego miejsca w swoim rodzicu, co jest kluczowe w projektowaniu układów. W praktyce może być używany do tworzenia sekcji strony, nagłówków, stopki czy artykułów, co pozwala na lepszą organizację kodu i stylów. W kontekście standardów, <div> jest częścią W3C HTML5, co zapewnia jego szeroką akceptację i zgodność z przeglądarkami. Użycie <div> do grupowania obszarów na poziomie bloków jest zatem najlepszą praktyką w nowoczesnym web designie. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 36</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktora-czynnosc-gwarantujaca-poprawne-wykonanie-prz-da3566b9" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Którą czynność gwarantującą poprawne wykonanie przedstawionego kodu Java Script, należy wykonać przed pętlą? <table style="border: 2px solid black; border-collapse: collapse; margin-bottom: 20px;"> <tr> <td style="border: 1px solid black; padding: 10px; font-family: monospace;"> var text;<br> for ( var i = 0; i < tab.length; i++ ) {<br> text += tab[i] + "<br>";<br> } </td> </tr> </table></p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-danger bg-opacity-10 border-danger text-danger "> <div class="flex-grow-1"> <span>A. Sprawdzić rozmiar tabeli tab.</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. Sprawdzić czy text j est typu znakowego.</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>C. Zainicjować zmienną text.</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. Zadeklarować zmienną i.</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-danger mb-0"> Wygląda na to, że odpowiedź nie była poprawna. Pozostałe opcje, tj. 'Sprawdzić czy text j est typu znakowego', 'Zadeklarować zmienną i', 'Sprawdzić rozmiar tabeli tab', nie są bezpośrednio związane z poprawnym wykonaniem kodu przedstawionego w pętli. Chociaż wszystkie te działania mogą być istotne w różnych kontekstach programowania, w tym przypadku żadne z nich nie gwarantuje poprawnego wykonania kodu. Deklaracja zmiennej 'i' czy sprawdzenie rozmiaru tabeli 'tab' jest często stosowane w pętlach, jednak nie gwarantują one poprawnego działania kodu w pętli bez odpowiedniego zainicjowania zmiennej 'text'. Zrozumienie tego aspektu jest kluczowe dla efektywnego programowania, zarówno w JavaScript, jak i w innych językach programowania. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 37</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="najprostszy-sposob-zamiany-obiektu-oznaczonego-cyf-c1529e29" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Najłatwiejszym sposobem na zmianę obiektu z numerem 1 na obiekt z numerem 2 jest</p> <figure class="figure mt-3"> <img src="/images/6886.png" class="figure-img img-fluid rounded" alt="Ilustracja do pytania" itemprop="image"> </figure> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. animacja obiektu</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. narysowanie obiektu docelowego</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. zmiana warstwy obiektu</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>D. geometriczne przekształcenie obiektu</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Geometryczne transformowanie obiektu to proces, który pozwala na zmiany w wielkości, kształcie, pozycji lub orientacji obiektu bez modyfikacji jego struktury. W przypadku zamiany obiektu oznaczonego cyfrą 1 na obiekt oznaczony cyfrą 2, transformacja geometryczna, jak skalowanie, jest najprostszą metodą. Skalowanie pozwala na proporcjonalne powiększenie obiektu, co jest niezbędne, gdy chcemy zwiększyć jego rozmiar bez zniekształceń. W praktyce, narzędzia do obróbki grafiki czy modelowania 3D, takie jak Adobe Illustrator czy AutoCAD, oferują funkcje do precyzyjnego skalowania. Kluczowe jest zachowanie proporcji, co można osiągnąć poprzez skalowanie względem określonego punktu odniesienia. Transformacje geometryczne są fundamentalne w wielu dziedzinach, takich jak projektowanie graficzne, inżynieria czy animacja komputerowa, i są zgodne z najlepszymi praktykami, które promują efektywność i precyzję w pracy z obiektami wizualnymi. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 38</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="baza-danych-zawiera-tabele-o-nazwie-pracownicy-o-p-ff34162b" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>W bazie danych znajduje się tabela o nazwie pracownicy z kolumnami: nazwisko, imię, pensja, wiek. Jak powinna wyglądać składnia polecenia do obliczenia średniej pensji pracowników?</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. select VAR (pracownicy) into pensja</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. select AVG (nazwisko) into pensja</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. select VAR (pensja) from nazwisko</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>D. select AVG (pensja) from pracownicy</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Poprawna odpowiedź, czyli polecenie 'select AVG (pensja) from pracownicy', wykorzystuje funkcję agregującą AVG, która jest standardowo stosowana w SQL do obliczania średniej wartości w kolumnie. W tym przypadku, polecenie to oblicza średnią pensję pracowników zapisanych w tabeli 'pracownicy'. Użycie funkcji AVG jest zgodne z dobrymi praktykami SQL, które zalecają stosowanie odpowiednich funkcji agregujących w celu efektywnego przetwarzania danych. Wartości w kolumnie 'pensja' są analizowane, a wynik zwraca jedną wartość — średnią pensję, co jest niezwykle użyteczne w kontekście raportowania czy analizy wynagrodzeń. Przykładowo, jeśli tabela zawiera pensje 3000, 4000 i 5000, funkcja AVG zwróci 4000. Tego rodzaju zapytania są powszechnie stosowane w raportach kadrowych oraz podczas analizy budżetu w organizacjach, co czyni je niezbędnym elementem wiedzy dla analityków danych oraz programistów baz danych. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 39</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="pole-lub-zbior-pol-jednoznacznie-identyfikujacy-ka-062dcef7" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Element lub grupa elementów, która w jednoznaczny sposób identyfikuje każdy pojedynczy rekord w tabeli w bazie danych, nazywa się kluczem</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. inkrementacyjny</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>B. podstawowy</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. obcy</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. przestawny</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Klucz podstawowy (ang. primary key) to fundamentalny element projektowania baz danych, który jednoznacznie identyfikuje każdy wiersz w tabeli. Jego główną funkcją jest zapewnienie unikalności danych, co oznacza, że żaden z wierszy nie może mieć tej samej wartości klucza podstawowego. W praktyce często wykorzystuje się pole takie jak 'id', które jest autoinkrementowane, dzięki czemu każdy nowy rekord otrzymuje unikalny numer. Klucze podstawowe są kluczowe dla zapewnienia integralności referencyjnej – umożliwiają powiązanie danych z różnych tabel. Na przykład, w tabeli 'Klienci' możemy mieć klucz podstawowy 'KlientID', który jest następnie używany jako klucz obcy w tabeli 'Zamówienia', co pozwala na łatwe śledzenie zamówień przypisanych do konkretnego klienta. Dobrą praktyką jest także stosowanie kluczy podstawowych jako indeksów, co zwiększa wydajność zapytań w bazie danych. Ważne jest, aby klucz podstawowy był jak najbardziej stabilny i niezmienny w czasie, aby uniknąć problemów z integracją danych. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 40</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="tabela-filmy-zawiera-klucz-gowny-id-oraz-klucz-o-6bd5d4a4" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Tabela filmy zawiera klucz główny id oraz klucz obcy rezyserID. Tabela reżyserzy posiada klucz główny id. Obie tabele są powiązane relacją jeden do wielu, gdzie strona reżyserzy jest po stronie jeden, a filmy po stronie wiele. Aby wykonać kwerendę SELECT łączącą tabele filmy i reżyserzy, należy użyć zapisu</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. ... filmy JOIN rezyserzy ON filmy.id=rezyserzy.filmyID ...</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>B. ... filmy JOIN rezyserzy ON filmy.rezyserzyID=rezyserzy.id ...</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>C. ... filmy JOIN rezyserzy ON filmy.id=rezyserzy.id ...</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. ... filmy JOIN rezyserzy ON filmy.rezyserID=rezyserzy.filmyID ...</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> W odpowiedzi na to pytanie, prawidłowa instrukcja SQL do połączenia tabel 'filmy' i 'rezyserzy' brzmi: '... filmy JOIN rezyserzy ON filmy.rezyserID=rezyserzy.id ...'. W tym przypadku używamy klucza obcego 'rezyserID' z tabeli 'filmy', który wskazuje na klucz główny 'id' w tabeli 'rezyserzy'. Taka konstrukcja jest zgodna z zasadą relacyjnych baz danych, gdzie klucz obcy w jednej tabeli odwołuje się do klucza głównego w drugiej tabeli, co umożliwia powiązanie rekordów. Dzięki temu możemy uzyskać dane o filmach oraz ich reżyserach w jednym zapytaniu. Przykładowe zapytanie SELECT mogłoby wyglądać następująco: 'SELECT filmy.nazwa, rezyserzy.imie, rezyserzy.nazwisko FROM filmy JOIN rezyserzy ON filmy.rezyserID=rezyserzy.id;'. Warto pamiętać, że poprawne użycie kluczy jest kluczowe dla integritety danych w bazie, a także ułatwia późniejsze analizy i raportowanie. W kontekście standardów SQL, ta metoda łączenia tabel jest zgodna z normami ANSI SQL, które definiują struktury zapytań dla relacyjnych baz danych. </div> </div> </article> <!-- Przyciski nawigacyjne --> <div class="d-grid gap-2 mt-4"> <div class="d-inline-block mb-2"> <a href="/egzamin/?profession=technik-programista&qualification=inf-03" class="btn btn-outline-primary"> <i class="fas fa-redo me-2"></i>Rozpocznij nowy egzamin </a> </div> <div class="d-inline-block"> <a href="/" class="btn btn-outline-secondary"> <i class="fas fa-home me-2"></i>Powrót do strony głównej </a> </div> </div> </div> </div> </div> </main> <!-- Footer --> <footer class="footer mt-auto py-4"> <div class="container"> <div class="row"> <!-- About Section --> <div class="col-lg-4 footer-section"> <h2 class="h5">O Egzaminach Zawodowych</h2> <p> Portal z kompleksową bazą pytań egzaminacyjnych dla uczniów szkół technicznych. Przygotuj się do egzaminu zawodowego z naszymi materiałami. </p> </div> <!-- Popular Qualifications --> <div class="col-lg-4 footer-section"> <h2 class="h5">Losowe kwalifikacje</h2> <div class="row"> <div class="col-6"> <a href="/technik-prac-biurowych/EKA.06/" class="footer-link"> <span>EKA.06</span> <small class="text-muted">(412)</small> </a> </div> <div class="col-6"> <a href="/technik-agrobiznesu/ROL.05/" class="footer-link"> <span>ROL.05</span> <small class="text-muted">(622)</small> </a> </div> <div class="col-6"> <a href="/technik-ekonomista/EKA.05/" class="footer-link"> <span>EKA.05</span> <small class="text-muted">(830)</small> </a> </div> <div class="col-6"> <a href="/tapicer/DRM.05/" class="footer-link"> <span>DRM.05</span> <small class="text-muted">(328)</small> </a> </div> <div class="col-6"> <a href="/technik-turystyki-na-obszarach-wiejskich/HGT.09/" class="footer-link"> <span>HGT.09</span> <small class="text-muted">(363)</small> </a> </div> <div class="col-6"> <a href="/technik-architektury-krajobrazu/OGR.04/" class="footer-link"> <span>OGR.04</span> <small class="text-muted">(294)</small> </a> </div> <div class="col-6"> <a href="/technik-usug-fryzjerskich/FRK.03/" class="footer-link"> <span>FRK.03</span> <small class="text-muted">(534)</small> </a> </div> <div class="col-6"> <a href="/technik-technologii-chemicznej/CHM.02/" class="footer-link"> <span>CHM.02</span> <small class="text-muted">(296)</small> </a> </div> <div class="col-6"> <a href="/technik-gornictwa-odkrywkowego/GIW.03/" class="footer-link"> <span>GIW.03</span> <small class="text-muted">(225)</small> </a> </div> <div class="col-6"> <a href="/technik-budowy-jednostek-pywajacych/TWO.03/" class="footer-link"> <span>TWO.03</span> <small class="text-muted">(146)</small> </a> </div> </div> </div> <!-- Additional Info --> <div class="col-lg-4 footer-section"> <h2 class="h5">O portalu</h2> <p> Baza pytań do egzaminów zawodowych dla uczniów szkół technicznych i branżowych. Materiały zgodne z wymaganiami CKE. </p> </div> </div> <!-- Copyright & Links --> <hr class="footer-divider"> <div class="row align-items-center"> <div class="col-md-8 text-center text-md-start"> <p class="mb-0">© 2025 <a href="https://brylka.net" class="footer-link" aria-label="brylka.net">brylka.net</a> | <a href="/about-me/" class="footer-link" aria-label="O mnie i zawodowe.edu.pl">Bartosz Bryniarski</a></p> </div> <div class="col-md-4 text-center text-md-end"> <!-- <a href="/sitemap.xml" class="footer-link" aria-label="Mapa strony"> <i class="fas fa-sitemap" aria-hidden="true"></i> <span>Mapa strony</span> </a> --> </div> </div> </div> </footer> <!-- Back to top button --> <button id="backToTop" class="btn btn-outline-primary back-to-top" aria-label="Przewiń do góry strony" style="display: none;"> <i class="fas fa-arrow-up" aria-hidden="true"></i> </button> <!-- Cookie Banner --> <div id="cookieConsent" class="position-fixed start-0 bottom-0 py-3 shadow rounded-end" style="display: none; z-index: 1050; max-width: 50%; background-color: rgba(248, 249, 250, 0.95);"> <div class="container-fluid px-4"> <div class="d-flex flex-column gap-2"> <div> <i class="fas fa-cookie-bite me-2 text-secondary" aria-hidden="true"></i> <span class="small"> Strona wykorzystuje pliki cookies do poprawy doświadczenia użytkownika oraz analizy ruchu. <a href="#" class="footer-link" id="cookieDetails" data-bs-toggle="modal" data-bs-target="#cookieModal"> Szczegóły </a> </span> </div> <div class="d-flex gap-2 justify-content-end"> <button id="cookieAccept" class="btn btn-outline-primary btn-sm">Akceptuję</button> <button id="cookieReject" class="btn btn-outline-secondary btn-sm">Odrzuć</button> </div> </div> </div> </div> <!-- Modal z informacjami o cookies --> <div class="modal fade" id="cookieModal" tabindex="-1" aria-labelledby="cookieModalLabel" aria-hidden="true"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <h2 class="modal-title fs-5" id="cookieModalLabel">Polityka plików cookies</h2> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button> </div> <div class="modal-body"> <h6 class="fw-bold">Czym są pliki cookies?</h6> <p> Cookies to małe pliki tekstowe, które są zapisywane na urządzeniu użytkownika podczas przeglądania stron internetowych. Służą one do zapamiętywania preferencji, śledzenia zachowań użytkowników oraz poprawy funkcjonalności serwisu. </p> <h6 class="fw-bold mt-4">Jakie cookies wykorzystujemy?</h6> <ul class="list-unstyled ps-3"> <li><i class="fas fa-check-circle text-success me-2"></i><strong>Niezbędne cookies</strong> - konieczne do prawidłowego działania strony</li> <li><i class="fas fa-check-circle text-success me-2"></i><strong>Funkcjonalne cookies</strong> - umożliwiające zapamiętanie wybranych ustawień (np. wybrany motyw)</li> <li><i class="fas fa-check-circle text-success me-2"></i><strong>Analityczne cookies</strong> - pozwalające zbierać informacje o sposobie korzystania ze strony</li> </ul> <h6 class="fw-bold mt-4">Jak długo przechowujemy cookies?</h6> <p> Pliki cookies wykorzystywane w naszym serwisie mogą być sesyjne (usuwane po zamknięciu przeglądarki) lub stałe (pozostają na urządzeniu przez określony czas). </p> <h6 class="fw-bold mt-4">Jak zarządzać cookies?</h6> <p> Możesz zarządzać ustawieniami plików cookies w swojej przeglądarce internetowej. Większość przeglądarek domyślnie dopuszcza przechowywanie plików cookies, ale możliwe jest również całkowite zablokowanie tych plików lub usunięcie wybranych z nich. </p> </div> <div class="modal-footer"> <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Zamknij</button> <button type="button" class="btn btn-outline-primary" id="acceptCookiesModal">Akceptuję wszystkie</button> </div> </div> </div> </div> <!-- JavaScript --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script> <script src="/static/exams/js/code.js" defer></script> <script src="/static/exams/js/report_modal.js" defer></script> <script> document.addEventListener('DOMContentLoaded', function() { // Dodaj obsługę motywów dla banera cookie function updateCookieBannerTheme() { const cookieBanner = document.getElementById('cookieConsent'); const currentTheme = document.body.getAttribute('data-theme'); if (!cookieBanner) return; // Ustaw domyślny jasny styl cookieBanner.style.backgroundColor = 'rgba(248, 249, 250, 0.95)'; cookieBanner.style.color = '#212529'; cookieBanner.classList.remove('border-top', 'border-white'); // Zastosuj style zgodnie z motywem if (currentTheme === 'dark') { cookieBanner.style.backgroundColor = 'rgba(52, 58, 64, 0.95)'; cookieBanner.style.color = '#fff'; } else if (currentTheme === 'high-contrast') { cookieBanner.style.backgroundColor = '#000'; cookieBanner.style.color = '#fff'; cookieBanner.classList.add('border-top', 'border-white'); } } // Sprawdź, czy użytkownik już dokonał wyboru if (!localStorage.getItem('cookieConsent')) { // Jeśli nie, pokaż banner const cookieBanner = document.getElementById('cookieConsent'); if (cookieBanner) { cookieBanner.style.display = 'block'; updateCookieBannerTheme(); // Dostosuj szerokość na małych ekranach function adjustWidth() { if (window.innerWidth < 768) { cookieBanner.style.maxWidth = '100%'; } else { cookieBanner.style.maxWidth = '50%'; } } // Wywołaj przy ładowaniu i przy zmianie rozmiaru okna adjustWidth(); window.addEventListener('resize', adjustWidth); } } // Obsługa zmiany motywu const themeButtons = document.querySelectorAll('.theme-btn'); themeButtons.forEach(btn => { btn.addEventListener('click', function() { setTimeout(updateCookieBannerTheme, 50); }); }); // Obsługa przycisku akceptacji document.getElementById('cookieAccept')?.addEventListener('click', function() { localStorage.setItem('cookieConsent', 'accepted'); document.getElementById('cookieConsent').style.display = 'none'; }); // Obsługa przycisku odrzucenia document.getElementById('cookieReject')?.addEventListener('click', function() { localStorage.setItem('cookieConsent', 'rejected'); document.getElementById('cookieConsent').style.display = 'none'; }); // Obsługa przycisku akceptacji w modalu document.getElementById('acceptCookiesModal')?.addEventListener('click', function() { localStorage.setItem('cookieConsent', 'accepted'); document.getElementById('cookieConsent').style.display = 'none'; // Zamknij modal var cookieModal = bootstrap.Modal.getInstance(document.getElementById('cookieModal')); cookieModal?.hide(); }); }); </script> <!-- Toast messages initialization --> <script> document.addEventListener('DOMContentLoaded', function() { const copyButton = document.getElementById('copy-link-button'); if (copyButton) { copyButton.addEventListener('click', function() { const input = document.getElementById('share-link-input'); input.select(); document.execCommand('copy'); // Zmień tekst przycisku na potwierdzenie const originalText = this.innerHTML; this.innerHTML = '<i class="fas fa-check me-1"></i> Skopiowano!'; // Przywróć oryginalny tekst po 2 sekundach setTimeout(() => { this.innerHTML = originalText; }, 2000); }); } }); </script> </body> </html>