Znacznik
jest kluczowym elementem każdej strony internetowej, który znajduje się w sekcji <head> dokumentu HTML. Jego podstawową funkcją jest określenie tytułu strony, który jest wyświetlany w pasku tytułowym przeglądarki oraz w wynikach wyszukiwania. Wersja HTML5 podkreśla znaczenie tego znacznika, czyniąc go wymaganym do poprawnej walidacji dokumentu. Brak znacznika <title> prowadzi do błędu walidacji, co może wpływać na SEO oraz użyteczność strony. Dobrze zaprojektowany tytuł powinien być krótki, ale zwięzły, zawierać kluczowe słowa związane z treścią strony, co pozytywnie wpływa na pozycjonowanie w wyszukiwarkach. Przykład poprawnego znacznika to: <title>Moja Strona Internetowa. Ważne jest, aby tytuł był unikalny dla każdej podstrony, co ułatwia użytkownikom oraz wyszukiwarkom identyfikację treści. W praktyce, zrozumienie roli znacznikajest kluczowe dla każdego, kto tworzy strony internetowe, ponieważ jego obecność ma istotny wpływ na wrażenia użytkowników oraz sukces witryny w Internecie. </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 8</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktore-polecenie-sql-zamieni-w-tabeli-tab-w-kolumn-dd51f685" 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óre polecenie SQL zaktualizuje w tabeli tab wartość Ania na Zosia w kolumnie kol?</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. ALTER TABLE tab CHANGE kol='Ania' kol='Zosia';</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. ALTER TABLE tab CHANGE kol='Zosia' kol='Ania';</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. UPDATE tab SET kol='Zosia' WHERE kol='Ania';</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. UPDATE tab SET kol='Ania' WHERE kol='Zosia';</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> W tym przypadku, żeby zmienić 'Ania' na 'Zosia' w kolumnie 'kol' w tabeli 'tab', wykorzystujemy polecenie UPDATE. To umożliwia nam modyfikację danych, które już są w bazie. Składnia jest dosyć prosta: UPDATE nazwa_tabeli SET kolumna='nowa_wartość' WHERE warunek. Więc w tym naszym przykładzie, musimy ustalić, że w kolumnie 'kol' jest obecnie 'Ania', żeby wymienić ją na 'Zosia'. Jak to napiszesz, to będzie wyglądać tak: UPDATE tab SET kol='Zosia' WHERE kol='Ania';. Tego typu polecenia są naprawdę przydatne, zwłaszcza w systemach CRM, gdzie często aktualizujemy dane o klientach. Co ciekawe, stosując SQL, działamy zgodnie z zasadami ACID, co sprawia, że nasze dane zachowują spójność. Nie zapomnij też, że przed aktualizacją warto mieć kopię zapasową, żeby w razie czego nie stracić nic ważnego. </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 9</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-javascript-wywoanie-zdarzenia-onkeydown-nastapi-876ac584" 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 JavaScript zdarzenie onKeydown zostanie wywołane, gdy klawisz</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. myszki został zwolniony</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. myszki został naciśnięty</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. klawiatury został naciśnięty</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. klawiatury został zwolniony</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Zdarzenie onKeydown w JavaScript jest wywoływane, gdy użytkownik naciśnie klawisz na klawiaturze. To fundamentalne zdarzenie jest często wykorzystywane w aplikacjach webowych do obsługi interakcji użytkowników, takich jak wprowadzanie danych czy nawigacja po formularzach. W momencie naciśnięcia klawisza, przeglądarka emituje to zdarzenie, co pozwala programistom na reagowanie na konkretne akcje. Na przykład, jeśli chcemy stworzyć prostą grę opartą na ruchu postaci, możemy wykorzystać onKeydown do wykrywania klawiszy strzałek i poruszania postacią w odpowiednich kierunkach. Warto również zauważyć, że onKeydown różni się od onKeyup, które jest wywoływane, gdy klawisz jest zwolniony, co ma znaczenie w przypadku obsługi sekwencji klawiszy oraz klawiszy modyfikujących, takich jak Shift czy Ctrl. Zrozumienie tych różnic jest kluczowe dla tworzenia responsywnych i interaktywnych aplikacji webowych, zgodnych z najlepszymi praktykami 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 10</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktore-z-polecen-nadaje-najnizszy-poziom-uprawnien-a99b5f9d" 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óre z poniższych poleceń przyznaje użytkownikowi <i>uczen</i> najniższy poziom uprawnień w zakresie zmiany danych i struktury tabel?</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. GRANT INSERT, DROP ON szkola.przedmioty TO uczen;</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>B. GRANT SELECT ON szkola.przedmioty TO uczen;</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. GRANT DROP ON szkola.przedmioty TO uczen;</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>D. GRANT ALTER, SELECT ON szkola.przedmioty TO uczen;</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-danger mb-0"> Rozpatrując inne polecenia, które zostały zaproponowane, należy zauważyć, że każde z nich przyznaje użytkownikowi 'uczen' szerszy zakres uprawnień, co nie jest zgodne z założeniem nadawania minimalnych uprawnień. Przyznanie uprawnień DROP, jak w przypadku polecenia GRANT DROP ON szkola.przedmioty TO uczen, pozwoliłoby użytkownikowi usunąć tabelę 'przedmioty', co jest nieakceptowalne w kontekście użytkownika edukacyjnego. Takie działanie nie tylko zagrażałoby integralności bazy danych, ale również mogłoby prowadzić do utraty ważnych informacji. Podobnie, przyznanie uprawnień INSERT, jak w poleceniu GRANT INSERT, DROP ON szkola.przedmioty TO uczen, umożliwia użytkownikowi dodawanie nowych rekordów do tabeli, co w przypadku ucznia nie jest pożądane, ponieważ jego rola powinna być ograniczona do przeglądania danych. Co więcej, polecenie GRANT ALTER, SELECT ON szkola.przedmioty TO uczen zawiera uprawnienie ALTER, które pozwala na modyfikację struktury tabeli, co również nie powinno mieć miejsca w kontekście użytkownika, który jest tylko uczniem. Wszelkie te niepoprawne podejścia prowadzą do niebezpieczeństwa związane z nieautoryzowanymi zmianami w bazie danych, co jest sprzeczne z najlepszymi praktykami w zakresie zarządzania uprawnieniami i bezpieczeństwa danych. Warto pamiętać, że właściwe zarządzanie uprawnieniami nie tylko zabezpiecza dane, ale również usprawnia procesy edukacyjne, zapewniając odpowiedni dostęp do informacji w sposób kontrolowany. </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 11</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-1 border-secondary "> <div class="flex-grow-1"> <span>B. 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>C. 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 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. 0,4,8,12,16,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 12</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktora-z-deklaracji-funkcji-w-jezyku-c-ma-paramet-84fe0095" 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óra z definicji funkcji w języku C++ przyjmuje parametr typu zmiennoprzecinkowego i zwraca wartość typu całkowitego?</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. float fun1(void a)</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. float fun1(int a)</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. void fun1(int a)</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. int fun1(float a)</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź 'int fun1(float a);' jest poprawna, ponieważ funkcja ma parametr wejściowy typu 'float', co oznacza, że przyjmuje dane rzeczywiste. Zwracany typ 'int' wskazuje, że funkcja będzie generować wynik w formacie całkowitym. W praktyce, taka funkcjonalność może być użyteczna, gdy chcemy przetworzyć dane zmiennoprzecinkowe i uzyskać wynik jako liczbę całkowitą, na przykład w obliczeniach, gdzie zaokrąglamy wartości do najbliższej liczby całkowitej. W kontekście programowania w języku C++, standardowe praktyki zalecają, aby zwracać typ, który jest odpowiedni do kontekstu użycia funkcji. Często stosuje się konwersje typów, co w tym przypadku może być zastosowane do przekształcenia wartości zmiennoprzecinkowej na całkowitą. Dobrą praktyką jest również odpowiednie dokumentowanie funkcji, aby jasno określić, jakie typy danych są oczekiwane i jakie będą wyniki ich przetworzenia. Dzięki temu, kod staje się bardziej czytelny i łatwy do utrzymania. </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 13</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="aby-w-javascript-wykonac-wymienione-kroki-nalezy-71442911" 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 w JavaScript wykonać wymienione kroki: <table border="1"> <tr> <td> <pre><code>1. Wyświetlić okno do wpisania wartości z poleceniem "Podaj kwalifikację: ", następnie po zatwierdzeniu 2. Umieścić napis na stronie internetowej, gdzie w miejscu kropek znajduje się wartość pobrana z okna "Kwalifikacja: ..."</code></pre> </td> </tr> </table> należy w znaczniku <script> umieścić kod <table border="1"> <tr> <td> <pre><code>A. A = prompt("Podaj kwalifikację: "); document.write("Kwalifikacja: " + A); B. A = prompt("Podaj kwalifikację: "); document.write("Kwalifikacja: " .A); C. A = alert("Podaj kwalifikację: "); document.write("Kwalifikacja: " + A); D. A << prompt("Podaj kwalifikację: "); document.write("Kwalifikacja: " + A);</code></pre> </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. B.</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. A.</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. C.</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. D.</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Dobra robota! W JavaScript, aby wyświetlić okno, w którym użytkownik może wpisać swoje kwalifikacje, najlepiej użyć funkcji `prompt`. Ta funkcja wyświetla okienko, w które można coś wpisać, a to co wprowadzisz, zostaje zwrócone. Potem, żeby pokazać te dane na stronie, używamy funkcji `document.write`. Dzięki temu możemy dynamicznie dodawać tekst na stronę, co jest super przydatne, gdy chcemy, żeby użytkownik wpisał jakieś informacje, które od razu wyświetlamy. Moim zdaniem, to fajny sposób na interakcję z użytkownikami! </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 14</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="fizyczny-model-replikacji-bazy-danych-przedstawio-bef7874e" 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>Model fizyczny replikacji bazy danych pokazany na ilustracji jest modelem</p> <figure class="figure mt-3"> <img src="/images/11134.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-2 bg-success bg-opacity-10 border-success text-success "> <div class="flex-grow-1"> <span>A. centralnego wydawcy</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. rozproszonym</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. równorzędnym</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. centralnego subskrybenta</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Model centralnego wydawcy jest popularnym rozwiązaniem w replikacji baz danych gdzie jeden centralny serwer działa jako główny wydawca danych do wielu subskrybentów. Kluczowa cecha tego modelu polega na tym że wszystkie zmiany są inicjowane na głównym serwerze co pozwala na scentralizowane zarządzanie danymi. Centralny wydawca zapewnia że dane są spójne i aktualizowane we wszystkich subskrybentach zmniejszając ryzyko konfliktów danych. Taka architektura jest często stosowana w organizacjach z rozproszonymi jednostkami gdzie centralny serwer w centrali obsługuje oddziały terenowe. Przykładami zastosowań są systemy ERP i CRM które wymagają jednoczesnej replikacji danych do wielu lokalizacji. Dobre praktyki w tej architekturze obejmują regularne monitorowanie wydajności serwerów oraz optymalizację przepustowości sieci by minimalizować opóźnienia. Modele centralnego wydawcy wykorzystują technologie takie jak SQL Server Replication czy Oracle Streams które są dobrze udokumentowane i szeroko stosowane w branży zapewniając niezawodność i skalowalność. </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 15</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="zakadajac-ze-zmienna-tablicowa-tab-jest-wypeni-74865110" 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>Zakładając, że tablica $tab zawiera liczby naturalne, co program wyświetli? <table style="border: 2px solid black; border-collapse: collapse;"><tr><td style="border: 1px solid black; padding: 10px; font-family: monospace;">$liczba = $tab[0];<br>foreach ($tab as $element)<br>{<br> if ($element > $liczba)<br> $liczba = $element;<br>}<br>echo $liczba;</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. elementy, które przewyższają zmienną $liczba</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. element tablicy o wartości $tab[0]</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. najmniejszy element 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>D. największy element tablicy</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Program w tym pytaniu ilustruje proces wyszukiwania największego elementu w tablicy za pomocą pętli foreach. Na początku zmienna $liczba jest inicjalizowana pierwszym elementem tablicy $tab. Następnie program iteruje przez wszystkie elementy tablicy i porównuje każdy z nich z aktualną wartością $liczba. Jeśli bieżący element jest większy niż $liczba, to wartość $liczba jest aktualizowana do tej większej wartości. Dzięki tej logice na końcu pętli $liczba przechowuje największy element z tablicy. Jest to zgodne z powszechnie stosowanym wzorcem projektowym polegającym na iteracyjnej aktualizacji zmiennej przechowującej ekstremalną wartość, w tym przypadku maksymalną. Taka metoda jest skuteczna i efektywna, ponieważ przeszukuje całą tablicę tylko raz, co jest operacją o złożoności czasowej O(n), gdzie n to liczba elementów w tablicy. Podejście to jest stosowane nie tylko w programach edukacyjnych, ale również w rzeczywistych projektach programistycznych, gdzie optymalne przetwarzanie danych jest kluczowe. Dobrą praktyką jest inicjalizacja zmiennej kontrolnej wartością pierwszego elementu tablicy, co unika niepotrzebnego porównywania z nieistotnymi wartościami, np. minus nieskończonością, i jest zgodne z zasadą KISS (Keep It Simple, Stupid). </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 16</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-jezyku-javascript-zdefiniowano-obiekt-samochod-b62c7f19" 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 stworzono obiekt Samochod. Aby wywołać jedną z jego metod, trzeba wpisać</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. Samochod()</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. Samochod.spalanie_na100</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. Samochod.kolor</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. Samochod.spalanie()</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> W języku JavaScript obiekt to podstawowa jednostka, która pozwala na grupowanie danych i funkcji w jednym miejscu. W kontekście zdefiniowanego obiektu Samochod, aby wywołać jego metodę, należy skorzystać z notacji kropkowej. Poprawne użycie to Samochod.spalanie(), co wskazuje na wywołanie metody 'spalanie' z obiektu 'Samochod'. Ta metoda może zawierać logikę obliczającą zużycie paliwa lub inne operacje związane z danym samochodem. Warto zauważyć, że metody w JavaScript są funkcjami przypisanymi do obiektów, co umożliwia ich wywołanie za pomocą notacji kropkowej. Przykładowo, jeśli obiekt Samochod ma zdefiniowaną metodę spalanie, możemy ją zainicjować i uzyskać wynik, co czyni nasz kod bardziej modularnym i czytelnym. Użycie odpowiednich metod jest zgodne z zasadami programowania obiektowego, które są fundamentem JavaScript. Metody obiektów mogą korzystać z właściwości innych obiektów, co zwiększa elastyczność programowania. Ta architektura jest zgodna ze standardem ECMAScript, który definiuje zasady dotyczące obiektów i funkcji w JavaScript. </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 17</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="na-obrazie-przedstawiono-efekt-formatowania-stylam-0dab4b30" 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>Na ilustracji przedstawiono rezultat stosowania stylów CSS oraz odpowiadający mu kod HTML, który generuje ten przykład. Przyjmując, że marginesy wewnętrzne mają wartość 50 px, natomiast zewnętrzne wynoszą 20 px, styl CSS dla tego obrazu wygląda następująco</p> <figure class="figure mt-3"> <img src="/images/6626.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. Odpowiedź A</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. Odpowiedź B</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. Odpowiedź C</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. Odpowiedź D</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź C jest poprawna, ponieważ zdefiniowany styl CSS zawiera wszystkie elementy odpowiadające przedstawionemu formatowaniu obrazu. Styl ten określa kolor tła jako Teal, co jest zgodne z opisem wizualnym obrazu. Dodatkowo zastosowanie solidnej czarnej ramki o grubości 4 pikseli odpowiada profesjonalnym standardom, które zapewniają wyraźne oddzielenie obrazu od reszty treści przez wyróżnienie go. Zastosowanie marginesów zewnętrznych o wartości 20 pikseli oraz wewnętrznych paddingów o wartości 50 pikseli jest zgodne z podanym założeniem, co pozwala na właściwe umiejscowienie obrazu na stronie, dając przestrzeń wokół i wewnątrz elementu. Dbałość o takie szczegóły jest kluczowa dla tworzenia responsywnych i estetycznych stron internetowych. Praktyczne stosowanie tego typu stylizacji umożliwia poprawienie czytelności oraz przyciąga uwagę użytkowników na znaczące elementy strony. Warto przy tym pamiętać o zasadzie KISS (Keep It Simple, Stupid), która zachęca do utrzymywania prostoty w projektach, co nie tylko ułatwia ich tworzenie ale też późniejsze utrzymanie. </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 18</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktory-kod-jezyka-html-da-efekt-formatowania-jak-n-1064c7f0" 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óry z poniższych kodów HTML spowoduje taki sam efekt formatowania jak na zaprezentowanym rysunku?</p> <figure class="figure mt-3"> <img src="/images/11271.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. <p>W tym <b>paragrafie <i>zobaczysz</i> sposoby formatowania</b> tekstu w HTML</p></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. <p>W tym <i>paragrafie zobaczysz sposoby formatowania</i> tekstu w HTML</p></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. <p>W tym <i>paragrafie </i><b>zobaczysz</b><i> sposoby formatowania</i> tekstu w HTML</p></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. <p>W tym <i>paragrafie <b>zobaczysz</b> sposoby formatowania </i> tekstu w HTML</p></span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Twoja odpowiedź jest w porządku, bo tag <i> w HTML rzeczywiście służy do pisania tekstu kursywą, a <b> do pogrubiania. Jak użyjesz tych znaczników razem, to zyskujesz fajny efekt, który widać na obrazku. Kawałek tekstu <i>paragrafie <b>zobaczysz</b> sposoby formatowania </i> sprawi, że cały fragment będzie w kursywie, ale tylko wyraz w <b> będzie pogrubiony. To jest spoko, bo pokazuje jak poprawnie używać znaczniki w HTML. Warto jednak pamiętać, żeby nie przesadzać z tymi znacznikami i używać ich tylko wtedy, gdy naprawdę chcesz wyróżnić coś w tekście. Dzisiaj większość stylizacji robi się przez CSS, co pozwala lepiej oddzielić strukturę od wyglądu dokumentu. Ale jak chcesz coś szybko wyróżnić w HTML, to użycie <i> i <b> jak najbardziej ma sens. To wszystko jest mega ważne, bo zrozumienie tych podstaw będzie przydatne, gdy będziesz budować strony. </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 19</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-kodzie-html-kolor-biay-mozna-zapisac-za-pomoca-4951c6c3" 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 kodzie HTML kolor biały można reprezentować przy użyciu wartości</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. rgb(255, 255, 255)</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. rgb (FF, FF, FF)</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. #000000</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. #255255</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź rgb(255, 255, 255) jest prawidłowa, ponieważ jest to standardowy sposób definiowania koloru białego w modelu RGB w kodzie HTML i CSS. Wartości RGB oznaczają Red, Green, Blue, a każdy składnik koloru (czerwony, zielony, niebieski) jest reprezentowany przez liczbę w zakresie od 0 do 255. W przypadku koloru białego wszystkie składniki są maksymalne, co przekłada się na pełne naświetlenie wszystkich trzech kolorów. W praktyce, użycie funkcji rgb() jest preferowane w sytuacjach, gdy chcemy dynamicznie modyfikować kolory za pomocą skryptów lub w CSS, co pozwala na lepszą kontrolę nad efektami wizualnymi. Na przykład, możemy łatwo zmieniać przezroczystość koloru, zmieniając wartości przez dodanie czwartego parametru, co jest zgodne z nowoczesnymi standardami CSS. Używanie wartości RGB jest również zgodne z zasadami dostępności oraz ułatwia pracę osobom z daltonizmem, ponieważ pozwala na łatwiejsze zrozumienie i manipulację kolorami. </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 20</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktorego-typu-danych-w-bazie-mysql-nalezy-uzyc-aby-1db6e9c5" 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>Jaki typ danych w MySQL należy zastosować, aby w jednym polu zapisać zarówno datę, jak i czas?</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. DATE</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. YEAR</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. BOOLEAN</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. TIMESTAMP</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Typ danych TIMESTAMP w MySQL jest przeznaczony do przechowywania zarówno daty, jak i czasu w jednym polu. Jest szczególnie przydatny w sytuacjach, gdy potrzebne jest śledzenie zdarzeń w czasie, takich jak rejestracja daty i godziny utworzenia lub modyfikacji rekordów w bazie danych. TIMESTAMP przechowuje dane w formacie 'YYYY-MM-DD HH:MM:SS', co pozwala na precyzyjne określenie momentu w czasie. Wartością dodaną tego typu danych jest automatyczne aktualizowanie znacznika czasu przy każdej zmianie rekordu (jeśli ustawimy odpowiednie opcje), co jest zgodne z najlepszymi praktykami w zakresie audytu danych. Przykładem zastosowania może być rejestracja logów aktywności użytkowników w aplikacji internetowej lub monitorowanie transakcji w systemach finansowych, gdzie dokładny czas zdarzenia jest kluczowy. Dodatkowo, TIMESTAMP obsługuje różnice stref czasowych, co czyni go idealnym wyborem w aplikacjach działających w różnych lokalizacjach geograficznych. </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 21</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="wynikiem-uruchomienia-zapytania-sql-jest-select-co-ce4817c9" 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>Wynik wykonania zapytania SQL to ```SELECT count(*) FROM Uczniowie WHERE srednia = 5;```</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. średnia ocen wszystkich uczniów</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. suma ocen uczniów, których średnia ocen to 5</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. całkowita liczba uczniów</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. liczba uczniów, których średnia ocen wynosi 5</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ź to liczba uczniów, których średnia ocen wynosi 5. Zapytanie SQL zawiera funkcję agregującą count(*), która zlicza wszystkie rekordy spełniające warunek określony w klauzuli WHERE. W tym przypadku filtrujemy uczniów, których średnia ocen jest równa 5. Tego rodzaju operacje są powszechnie stosowane w bazach danych do uzyskiwania statystyk oraz analizowania danych. Na przykład, jeśli chcemy ocenić skuteczność programu nauczania, możemy zastosować podobne zapytanie, aby zidentyfikować liczbę uczniów osiągających określony poziom w nauce. W praktyce ważne jest, aby zrozumieć, że przy używaniu funkcji agregujących w SQL, wyniki mogą być niezwykle cenne dla menedżerów edukacyjnych, którzy podejmują decyzje na podstawie danych. Rekomendowane jest również zrozumienie kontekstu, w jakim są stosowane takie zapytania, oraz sposób, w jaki można je optymalizować dla większych zbiorów danych, aby uzyskać szybkie i dokładne wyniki. </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 22</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktory-z-obiektow-relacyjnej-bazy-danych-bedacy-ko-a8acb346" 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óry z elementów relacyjnej bazy danych, zapisany w języku SQL, może być wykorzystany w zapytaniach modyfikujących kolumny danych udostępnione jako tabela, niezależnie od tego, czy jest stworzony programowo, czy dynamicznie?</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. Funkcja zdefiniowana</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. Procedura składowa</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. Trigger</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. Zasada</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Funkcja zdefiniowana przez użytkownika (UDF) w języku SQL jest obiektem bazy danych, który może być wykorzystywany w zapytaniach, w tym w zapytaniach modyfikujących kolumny danych. UDF mogą przyjmować argumenty, wykonywać operacje na tych danych i zwracać wynik, co czyni je wszechstronnym narzędziem w programowaniu baz danych. Użycie funkcji zdefiniowanej zwiększa modularność kodu oraz umożliwia ponowne wykorzystanie logiki biznesowej, co jest zgodne z zasadami DRY (Don't Repeat Yourself). Przykładem zastosowania może być funkcja, która oblicza rabat na podstawie ceny i procentu rabatu, co można wywołać w zapytaniach aktualizujących ceny produktów. Warto również zauważyć, że UDF mogą być używane w kontekście różnych zapytań, a ich wyniki mogą być przetwarzane jak każda inna kolumna w wynikach zapytań. Dzięki temu programiści mogą łatwo implementować bardziej złożoną logikę bezpośrednio w zapytaniach SQL, co jest zgodne z najlepszymi praktykami w zakresie zarządzania danymi. </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 23</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="dla-ktorych-imion-zastosowana-w-zapytaniu-klauzula-becefbe2" 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 imiona spełniają warunki klauzuli LIKE w podanym zapytaniu?</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. Gerald, Jarosław, Marek, Tamara</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. Rafał, Rebeka, Renata, Roksana</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. Arleta, Krzysztof, Krystyna, Tristan</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. Krzysztof, Krystyna, Romuald</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-danger mb-0"> Wybór tych imion, które nie pasują do wzoru z klauzulą LIKE, jest trochę mylący. Te imiona, które zaznaczyłeś, nie mają 'r' na właściwych miejscach, co jest kluczowe. Na przykład, 'Rafał', 'Rebeka', 'Renata' czy 'Roksana' mają 'r' na pierwszej pozycji albo w ogóle! To pokazuje, jak ważne jest rozumienie pozycji znaków w wzorze LIKE, gdzie '_' oznacza jeden znak, a '%' może być niczym lub więcej. No i jak 'r' jest na pierwszej pozycji, to nie ma szans, żeby pasowało do '_r%'. Często błędy we wzorach wynikają z niedopatrzeń w pozycjach znaków. Wiedza na ten temat jest mega ważna, gdy pracujemy z bazami danych, bo bez tego może być bałagan w wyszukiwaniach. </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 24</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-formularzu-dane-z-pola-input-o-typie-number-zost-9bc55ac0" 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 formularzu wartość z pola input o typie number została przypisana do zmiennej a i następnie przetworzona w skrypcie JavaScript w poniższy sposób. Jaki typ będzie miała zmienna z? <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;">var</span> z = <span style="color: brown;">parseFloat</span>(a);</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. liczbowego, całkowitego</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. NaN</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. zmiennoprzecinkowego</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. napisowego</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> W języku JavaScript funkcja parseFloat() jest używana do konwersji wartości tekstowych na liczby zmiennoprzecinkowe. Podczas pobierania danych z pola input typu number, wartość często jest traktowana jako string i konieczne jest jej przekształcenie w liczbę, aby móc na niej wykonywać operacje matematyczne. Funkcja parseFloat() analizuje łańcuch znaków i próbuje wyodrębnić z niego liczbę zmiennoprzecinkową. Nawet jeśli podana wartość jest zapisana jako liczba całkowita, parseFloat() przekształci ją w liczbę zmiennoprzecinkową, co oznacza, że zmienna z będzie tego właśnie typu. Jest to standardowa praktyka w programowaniu w JavaScript, aby zapewnić, że dane numeryczne są przetwarzane w odpowiednim formacie. Konwersja na typ zmiennoprzecinkowy gwarantuje także, że wszelkie ułamki dziesiętne będą poprawnie obsługiwane, co jest kluczowe w wielu zastosowaniach, takich jak obliczenia finansowe czy prace związane z precyzyjnymi pomiarami. Warto zaznaczyć, że parseFloat() zwraca wartość NaN tylko wtedy, gdy dany ciąg nie zaczyna się od liczby, co czyni ten sposób konwersji bardzo elastycznym i często stosowanym w praktyce. </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 25</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktory-znacznik-html-jest-elementem-blokowym-dfa2ae31" 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óry z elementów HTML stanowi blokowy znacznik?</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</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. strong</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. p</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>D. span</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-danger mb-0"> Wybór znaczników takich jak <img>, <span> oraz <strong> jako elementów blokowych jest nieprawidłowy z kilku powodów. Znacznik <img> jest elementem, który ma na celu wstawienie obrazków do dokumentu HTML; jest to element liniowy, który nie tworzy nowej linii w układzie, co sprawia, że nie wypełnia całej dostępnej szerokości kontenera. Stosowanie <img> w kontekście blokowym byłoby błędne, ponieważ nie pełni roli strukturalnego elementu tekstowego. Element <span> to również znacznik liniowy, który używany jest do stylizacji fragmentów tekstu w obrębie innego bloku, ale sam w sobie nie ma znaczenia blokowego i nie wpływa na układ w sposób, w jaki to robi <p>. Użycie <span> jako blokowego elementu może prowadzić do niepoprawnych praktyk w kodowaniu, co negatywnie wpływa na czytelność oraz semantykę dokumentu. Z kolei znacznik <strong> jest wykorzystywany do podkreślenia ważności tekstu, jednak również zalicza się do elementów liniowych. Wybór tych znaczników zamiast <p> może prowadzić do nieczytelnych lub nieczytelnych układów stron, co jest sprzeczne z najlepszymi praktykami w projektowaniu responsywnych interfejsów użytkownika. Zrozumienie różnicy pomiędzy elementami blokowymi a liniowymi jest kluczowe dla tworzenia dobrze zorganizowanych i semantycznych stron internetowych. </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="grant-select-insert-update-on-klienci-to-anna-z-64560396" 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>GRANT SELECT, INSERT, UPDATE ON klienci TO anna; Zakładając, że użytkownik wcześniej nie posiadał żadnych uprawnień, to polecenie SQL przyzna użytkownikowi anna prawa jedynie 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. wybierania, dodawania rekordów oraz zmiany struktury wszystkich tabel w bazie o nazwie klienci</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. wybierania, wstawiania oraz aktualizacji danych tabeli o nazwie klienci</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. wybierania, dodawania rekordów oraz modyfikacji struktury tabeli o nazwie klienci</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. wybierania, wstawiania oraz aktualizacji danych wszystkich tabel w bazie o nazwie klienci</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź jest prawidłowa, ponieważ polecenie SQL 'GRANT SELECT, INSERT, UPDATE ON klienci TO anna;' przyznaje użytkownikowi 'anna' określone prawa do tabeli o nazwie 'klienci'. Prawa te obejmują możliwość wybierania, wstawiania oraz aktualizacji danych w tej tabeli, co jest zgodne z zasadami zarządzania uprawnieniami w systemach baz danych. W praktyce oznacza to, że użytkownik 'anna' będzie mógł wykonywać zapytania SELECT, co pozwoli mu na odczyt danych, a także wstawiać nowe rekordy (INSERT) oraz modyfikować istniejące (UPDATE). To jest standardowa praktyka w zarządzaniu dostępem do danych, która pozwala na precyzyjne kontrolowanie, jakie operacje mogą być wykonywane przez poszczególnych użytkowników. Dobrą praktyką jest ograniczenie uprawnień do minimum, które użytkownik potrzebuje do wykonania swoich zadań, co jest zgodne z zasadą najmniejszych uprawnień. Na przykład, jeżeli 'anna' jest odpowiedzialna tylko za wstawianie nowych klientów, to przyznawanie jej uprawnień do aktualizacji danych może nie być konieczne. W teorii i praktyce bazy danych, rozróżnienie pomiędzy różnymi rodzajami uprawnień jest kluczowe dla bezpieczeństwa i integralnoś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 27</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ktore-wyrazenie-logiczne-nalezy-zastosowac-w-jezyk-90ab4bdb" 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 wyrażenie logiczne powinno zostać użyte w języku JavaScript, aby przeprowadzić operacje wyłącznie na dowolnych liczbach ujemnych z zakresu jednostronnie domkniętego <-200, -100)?</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. (liczba >= -200) && (liczba < -100)</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. (liczba <= -200) || (liczba > -100)</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. (liczba >= -200) || (liczba > -100)</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. (liczba <= -200) && (liczba < -100)</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ź, (liczba >= -200) && (liczba < -100), jest zgodna z wymaganym zakresem liczb ujemnych. Wyrażenie to sprawdza, czy wartość zmiennej 'liczba' jest większa lub równa -200, a jednocześnie mniejsza niż -100. Oznacza to, że przyjmuje wszystkie liczby z przedziału, w tym -200, ale nie uwzględnia -100. To podejście jest zgodne z praktykami programowania, gdzie istotne jest dokładne definiowanie zakresów. W JavaScript stosowanie operatorów logicznych, takich jak &&, umożliwia precyzyjne warunkowanie wykonania kodu, co jest niezbędne do sprawnego zarządzania błędami oraz zwiększa czytelność kodu. Przykładowo, w kontekście walidacji danych, takie wyrażenie można wykorzystać do filtrowania nieprawidłowych wartości przed ich przetwarzaniem. Umożliwia to lepsze zarządzanie danymi oraz zapobiega błędom w aplikacjach. Zastosowanie tego wyrażenia w praktyce pokazuje, jak ważne jest precyzyjne formułowanie warunków, co jest kluczowym elementem skutecznego 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 28</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="ile-iteracji-bedzie-miaa-przedstawiona-petla-zap-8acfdbf9" 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>Ile razy zostanie wykonana pętla przedstawiona w języku PHP, zakładając, że zmienna kontrolna nie jest zmieniana w jej wnętrzu? for($i = 0; $i <= 10; $i++) { ...... }</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 razy</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. Nieskończoność</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. 10 razy</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. 11 razy</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 języku PHP, jak w przedstawionym przykładzie, ma na celu wykonanie bloku kodu wielokrotnie, w zależności od stanu zmiennej sterującej. W tym przypadku, początkowa wartość zmiennej $i wynosi 0, a warunek kontynuacji pętli to $i <= 10. Oznacza to, że pętla będzie kontynuować swoje działanie, dopóki zmienna $i będzie mniejsza lub równa 10. W każdym przebiegu pętli wartość $i jest inkrementowana o 1 za pomocą operatora ++, co oznacza, że przy każdym przejściu przez pętlę $i przyjmuje wartości 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 i 10. Ostatecznie, pętla wykonuje się, gdy $i osiąga wartość 10, a następnie po wykonaniu bloku kodu następuje inkrementacja, co sprawia, że $i staje się 11, co narusza warunek $i <= 10. Zatem pętla wykonuje się 11 razy, co czyni odpowiedź 11 poprawną. Przykładem zastosowania takiej pętli może być iteracja po elementach tablicy lub generowanie sekwencji liczb. Zgodnie z najlepszymi praktykami programistycznymi, ważne jest, aby zawsze kontrolować zmienne sterujące w pętli, aby uniknąć sytuacji takich jak nieskończone pętle, co jest szczególnie istotne w kontekście wydajności aplikacji. </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="ktory-z-formatow-graficznych-pozwala-na-zapis-prz-9ac800d4" 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óry z grafikowych formatów umożliwia zapis przezroczystego tła?</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. BMP</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. JPEG</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. GIF</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. RAW</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Format graficzny GIF (Graphics Interchange Format) jest jednym z niewielu, które umożliwiają zapis obrazów z przejrzystym tłem. GIF obsługuje przezroczystość poprzez wykorzystanie palety kolorów z maksymalnie 256 kolorami, co czyni go idealnym do prostych grafik, takich jak logo, ikony czy animacje. Przezroczystość w formacie GIF jest realizowana przez oznaczenie jednego z kolorów w palecie jako przezroczystego, co oznacza, że piksele o tym kolorze nie będą wyświetlane, a zamiast nich widać tło lub inne elementy graficzne. Dzięki temu GIF jest szeroko stosowany w Internecie, szczególnie na stronach, gdzie kluczowa jest oszczędność miejsca oraz szybkość ładowania. Warto również wspomnieć, że GIF obsługuje animacje, co czyni go popularnym formatem do tworzenia prostych ruchomych grafik. Format ten jest zgodny z wieloma standardami internetowymi, co dodatkowo zwiększa jego uniwersalność w zastosowaniach webowych i multimedialnych. </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="zrodem-danych-dla-raportu-moze-byc-ea72a776" 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 źródło danych może posłużyć do stworzenia raportu?</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. zapytanie SELECT</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. projekt raportu</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 ALTER</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. etykieta</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź 4: zapytania SELECT są naprawdę ważne, bo pozwalają na ściąganie konkretnych danych z bazy. To tak jakbyś miał klucz do swojej bazy informacji. Możemy dzięki nim stworzyć różne raporty, na przykład sprzedaży, wybierając dane z tabeli i filtrując je według daty, produktu czy regionu. Warto pamiętać o używaniu klauzuli WHERE, bo dzięki temu nie dostajemy zbędnych wyników, tylko to, co naprawdę nas interesuje. To, co fajne w zapytaniach SELECT, to że możemy łączyć różne tabele z użyciem JOIN, co pozwala na jeszcze bardziej skomplikowane raporty. Z mojego doświadczenia, umiejętność tworzenia zapytań SELECT i ich optymalizacja są kluczowe w analizie danych, a to pomaga w lepszym podejmowaniu decyzji w biznesie. </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="metainformacja-description-zawarta-w-pliku-zrod-6439c422" 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>Metainformacja “Description" zawarta w pliku źródłowym HTML powinna zawierać <table style="border: 2px solid black; border-collapse: collapse;"> <tr> <td style="border: 1px solid black; padding: 10px; font-family: monospace;"> <head><br> <meta name="Description" content="..." ><br> </head> </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. informację, kto jest autorem strony.</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. opis, co znajduje się na stronie.</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. nazwę programu, przy użyciu którego została stworzona strona.</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. wyrazy kluczowe, z których korzystają wyszukiwarki sieciowe.</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ź to 'opis, co znajduje się na stronie'. Metainformacja 'Description' w pliku źródłowym HTML jest wykorzystywana przez wyszukiwarki internetowe do wyświetlania opisu strony w wynikach wyszukiwania. Dzięki temu użytkownik może zobaczyć na pierwszy rzut oka, czy strona jest związana z jego zapytaniem, czy też nie. Jest to jedno z kluczowych narzędzi w SEO (Search Engine Optimization), które ma na celu zwiększenie widoczności strony w wynikach wyszukiwania. W praktyce, opis powinien być krótki, zwięzły i zawierać ważne informacje o treści strony. Dobrą praktyką jest również uwzględnienie kluczowych słów, na które użytkownicy mogą szukać. Opis ten powinien być zrozumiały dla użytkowników, a także jest to miejsce, gdzie można wykorzystać strategie marketingowe, aby zachęcić do odwiedzenia strony. </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="w-jezyku-html-zapisano-formularz-ktory-z-efektow-7e849a8f" 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 umieszczono formularz. Jakie skutki działania tego kodu zostaną pokazane przez przeglądarkę, jeśli użytkownik w drugim polu wprowadzi wartość "ala ma kota"?</p> <figure class="figure mt-3"> <img src="/images/53602.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. Efekt 1</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. Efekt 3</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. Efekt 2</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. Efekt 4</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Efekt 2 jest prawidłowy, ponieważ kod HTML używa elementu select do stworzenia listy rozwijanej z trzema opcjami: Kraków, Poznań i Szczecin. Użytkownik może wybrać jedną z tych opcji, co jest standardowym zastosowaniem elementu select w formularzach HTML. Drugim elementem jest pole input typu password które maskuje wpisywany tekst. W formularzach HTML pole typu password jest używane do ukrywania wprowadzanego tekstu co jest szczególnie ważne przy wprowadzaniu danych wrażliwych takich jak hasła. Gdy użytkownik wpisuje hasło widoczne są tylko znaki maskujące często kropki lub gwiazdki co zapewnia prywatność danych. Stosowanie takich elementów jest zgodne z dobrymi praktykami projektowania interfejsów użytkownika w sieci co zwiększa bezpieczeństwo i wygodę użytkowania formularzy. Właściwe korzystanie z elementów HTML jak select i input type=password jest kluczowe w tworzeniu efektywnych i bezpiecznych stron internetowych co jest szczególnie istotne w kontekście e-commerce i aplikacji bankowych. </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="aby-wyaczyc-dzwiek-dla-wyswietlanego-w-przegladar-b0b495c1" 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óry atrybut należy dodać do znacznika <video>, aby wyciszyć dźwięk odtwarzanego w przeglądarce filmu? <table style="border: 2px solid black; border-collapse: collapse;"> <tr> <td style="border: 1px solid black; padding: 10px; font-family: monospace;"> <video> <source src="film.mp4" type="video/mp4"> </video> </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. autoplay</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. muted</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. controls</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. loop</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Twoja odpowiedź jest poprawna. Atrybut 'muted' jest używany w znaczniku <video>, aby wyłączyć dźwięk dla filmu wyświetlanego w przeglądarce. Jest to sposób na sterowanie dźwiękiem bez konieczności korzystania z dodatkowych elementów kontrolujących odtwarzanie filmu. Jest to bardzo przydatne, gdy chcemy, aby film był odtwarzany w tle bez zakłócania użytkownika dźwiękiem, co jest często stosowane na stronach internetowych. Ważne jest to, że to atrybut 'muted' jest odpowiedzialny za początkowy stan dźwięku filmu, a nie za to, czy użytkownik będzie mógł go później włączyć. Dodatkowo, dobrą praktyką jest pozostawienie użytkownikowi możliwości sterowania dźwiękiem, nawet jeśli jest on domyślnie wyłączony, co można osiągnąć dodając atrybut 'controls'. </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="formatami-video-obsugiwanymi-w-standardzie-html5-e4cf57b5" 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>Formaty wideo, które są wspierane przez standard HTML5, to</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. MP4, Ogg, WebM</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. MP4, AVI</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. Ogg, AVI, MPEG</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. Ogg, QuickTime</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź MP4, Ogg, WebM jest poprawna, ponieważ te trzy formaty wideo są oficjalnie obsługiwane przez standard HTML5, co oznacza, że są zgodne z różnymi przeglądarkami internetowymi bez potrzeby używania dodatkowych wtyczek. Format MP4, oparty na kontenerze MPEG-4, jest szeroko stosowany z uwagi na jego efektywność w kompresji oraz wysoką jakość obrazu i dźwięku. Ogg to otwarty format, który wspiera kodek VP8, co czyni go popularnym wśród projektów o otwartym oprogramowaniu. WebM, z kolei, jest również formatem otwartym, zoptymalizowanym dla wideo w Internecie, co czyni go dobrym wyborem dla zastosowań webowych. Te formaty są zgodne z najlepszymi praktykami w zakresie wydajności i dostępności, co sprawia, że są preferowane podczas tworzenia treści wideo do zastosowań online. Przykładem ich użycia może być osadzanie wideo na stronach internetowych, gdzie różnorodność formatów pozwala na ich odtwarzanie na różnych urządzeniach oraz w różnych systemach operacyjnych. </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="ktore-dane-z-8-rekordow-wpisanych-do-tabeli-zwier-98e40fc6" 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 informacje z ośmiu wpisanych rekordów w tabeli zwierzęta zostaną przedstawione w wyniku wykonania wskazanej instrukcji SQL?</p> <figure class="figure mt-3"> <img src="/images/11108.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. Fafik, Brutus, Dika, Fuks</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. Dika, Fuks</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. Figaro, Dika, Fuks</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. Anna Kowalska, Jan Nowak</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Zapytanie SQL SELECT imie FROM zwierzeta WHERE rodzaj = 2 AND szczepienie = 2016; filtruje wyniki według dwóch kryteriów: rodzaj musi być równy 2 i rok szczepienia musi być 2016. W danych mamy kilka zwierząt, ale tylko Dika i Fuks spełniają oba te warunki. Dika i Fuks mają rodzaj równy 2 oraz rok szczepienia 2016, co czyni je jedynymi zwierzętami w tabeli spełniającymi te kryteria. Zrozumienie tego typu zapytań wymaga znajomości składni SQL oraz logiki warunkowej. W praktyce stosowanie filtrów WHERE to jedna z podstawowych technik selekcji danych umożliwiająca precyzyjne wyciąganie rekordów z dużych zbiorów danych. Warto również zaznaczyć, że poprawne używanie takich zapytań w pracy zawodowej jest niezbędne dla zapewnienia jakości i wydajności procesów związanych z bazami danych. Wiedza ta jest kluczowa w wielu branżach, w których przetwarzanie dużych ilości danych jest codziennoś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 36</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="var-osobapromptpodaj-imie-adam-b17651e3" 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>Kod w języku JavaScript, który został zapisany, daje w wyniku działania</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. uzyskanie z formularza wyświetlonego na stronie HTML imienia "Adam"</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. pokazanie okna z pustym polem do edycji</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. wyświetlenie okna z polem do edycji, w którym domyślnie znajduje się tekst "Adam"</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. bezpośrednie przypisanie do zmiennej osoba wartości "Adam"</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> W kodzie JavaScript zapisano wywołanie funkcji prompt, która jest standardową metodą do interakcji z użytkownikiem poprzez wyświetlenie okna dialogowego. Funkcja ta przyjmuje dwa argumenty: pierwszy to tekst, który będzie wyświetlony jako prośba o dane, a drugi to opcjonalna wartość domyślna, która pojawi się w polu edycyjnym okna dialogowego. W przykładzie użytkownik proszony jest o podanie imienia, a domyślną wartością, która jest predefiniowana w tym przypadku, jest 'Adam'. Działanie tego kodu spowoduje otwarcie okna z polem edycyjnym, w którym już znajduje się 'Adam', co ułatwia użytkownikowi wprowadzenie danych. Ponadto, gdy użytkownik kliknie 'OK' lub 'Anuluj', wynik (czyli wartość wpisana przez użytkownika lub null, jeśli anulował) zostanie przypisany do zmiennej 'osoba'. Warto zaznaczyć, że funkcja prompt jest powszechnie używana w aplikacjach webowych do szybkiego zbierania informacji od użytkowników. Dzięki temu kodowi programiści mogą efektywnie interactować z użytkownikami, co jest zgodne z duchem nowoczesnych aplikacji internetowych opartych na JavaScript. </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="atrybut-value-w-polu-formularza-xhtml-input-typ-d418e2ed" 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>Atrybut value w formularzu XHTML</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. ustawia pole jako tylko do odczytu</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. ogranicza maksymalną długość pola</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. określa nazwę pola</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. określa wartość domyślną</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Atrybut 'value' w polu formularza XHTML pełni kluczową rolę w określeniu wartości początkowej, która jest wyświetlana w danym polu tekstowym. W przypadku elementu <input type='text'>, wartość atrybutu 'value' jest predefiniowaną odpowiedzią, która pojawia się w polu, gdy formularz jest załadowany. To pozwala programistom na wprowadzenie domyślnych danych, co jest szczególnie przydatne w kontekście ułatwienia wprowadzania informacji przez użytkowników. Na przykład, jeśli mamy formularz, w którym użytkownik ma podać swoje imię, możemy ustawić 'value' na 'Jan', co sprawi, że pole wypełni się automatycznie tą wartością, dając użytkownikowi wskazówkę. Wartość ta może być również używana do ułatwienia wprowadzania danych w przypadku, gdy formularz jest ponownie wyświetlany po błędzie. Zgodnie z dokumentacją W3C dotyczącą XHTML, atrybut 'value' jest standardowo stosowany w formularzach, co czyni go niezbędnym narzędziem w projektowaniu interfejsów użytkownika. Odpowiednie wykorzystanie tego atrybutu przyczynia się do lepszej użyteczności aplikacji internetowych oraz zwiększa komfort użytkowników. </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="w-formularzu-dokumentu-php-istnieje-pole-ltinput-a3c90a9c" 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 formularzu dokumentu PHP znajduje się pole <input name="im">. Po tym, jak użytkownik wprowadzi ciąg znaków "Janek", aby dodać zawartość tego pola do bazy danych, w tablicy $_POST obecny jest element</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. im z następnym numerem indeksu</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. im z indeksem Janek</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. Janek z następnym numerem indeksu</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. Janek o indeksie im</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ź to "Janek o indeksie im", ponieważ w PHP, gdy formularz jest przesyłany, wartości pól formularza są przekazywane do tablicy globalnej $_POST, gdzie kluczami są nazwy pól, a wartościami są dane wprowadzone przez użytkownika. W przypadku pola <input name="im">, po wprowadzeniu przez użytkownika ciągu "Janek", w tablicy $_POST pojawi się element, w którym klucz to "im", a wartość to "Janek". Zgodnie z dobrymi praktykami programistycznymi, nazwy pól powinny być zrozumiałe i znaczące, co ułatwia późniejsze przetwarzanie danych. Przykładem może być sytuacja, w której tworzymy formularz rejestracyjny; odpowiednie nazewnictwo pól, takich jak "im" dla imienia, poprawia czytelność kodu oraz jego konserwowalność. Warto dodać, że dobrym zwyczajem jest również walidacja danych przed ich przetworzeniem, aby zapewnić bezpieczeństwo aplikacji oraz uniknąć potencjalnych ataków, takich jak SQL Injection. </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="ktory-parametr-obiektu-graficznego-ulegnie-zmianie-30d90e94" 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óry z parametrów obiektu graficznego zmieni się po zmianie wartości kanału alfa?</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. Kolejność wyświetlenia pikseli</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. Przezroczystość</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. Nasycenie barw</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. Ostrość krawędzi</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Kanał alfa jest kluczowym parametrem w zarządzaniu przezroczystością obiektów graficznych. Przezroczystość definiuje, w jakim stopniu dany obiekt jest widoczny na tle innych elementów graficznych. W systemach graficznych, takich jak Adobe Photoshop czy GIMP, kanał alfa może przyjmować wartości od 0 (całkowicie przezroczysty) do 255 (całkowicie nieprzezroczysty). Kiedy zmieniamy wartość kanału alfa, manipuluje to stopniem przezroczystości danego obiektu, co ma kluczowe znaczenie w projektowaniu graficznym oraz w tworzeniu efektów wizualnych. Przykładowo, w projektowaniu interfejsów użytkownika często stosuje się przezroczystość do uzyskania efektów wizualnych, które poprawiają estetykę oraz funkcjonalność. Dobrą praktyką jest używanie przezroczystości w celu tworzenia głębi i warstwowości w grafice, co może być przydatne w animacjach oraz w aplikacjach mobilnych, gdzie przejrzystość elementów interfejsu wpływa na użyteczność i doświadczenie użytkownika. Warto pamiętać, że manipulowanie kanałem alfa powinno być wcześniej przemyślane, aby osiągnąć zamierzony efekt wizualny bez negatywnego wpływu na czytelność i odbiór projektu. </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="w-jezyku-css-zdefiniowano-styl-sformatowana-style-cede62db" 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 CSS zdefiniowano styl. Sformatowana stylem sekcja będzie zawierała obramowanie o szerokości <table style="border: 2px solid black; border-collapse: collapse; margin-bottom: 20px;"> <tr> <td style="border: 1px solid black; padding: 10px; font-family: monospace;"> div { border: solid 2px blue;<br> margin: 20px; } </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. 20 px oraz marginesy wewnątrz tego obramowania.</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. 20 px oraz marginesy na zewnątrz tego obramowania.</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. 2 px oraz marginesy wewnątrz tego obramowania.</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. 2 px oraz marginesy na zewnątrz tego obramowania.</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Gratulacje, twoja odpowiedź jest poprawna! W CSS obramowanie (border) i margines (margin) są dwoma różnymi typami przestrzeni, które możemy zdefiniować wokół elementu. W tym pytaniu dokładnie określono styl obramowania jako linię ciągłą o szerokości 2 piksele. W praktyce jest to cienka linia otaczająca element na stronie. Z kolei margines zdefiniowany jako 20 pikseli to przestrzeń między obramowaniem a następnym elementem. Jest to zgodne ze standardami CSS, które mówią, że marginesy znajdują się zawsze na zewnątrz obramowania. To dlaczego '2 px oraz marginesy na zewnątrz tego obramowania' jest poprawną odpowiedzią. W praktyce, kontrolowanie obramowania i marginesów pozwala nam na precyzyjne ułożenie elementów na stronie, co jest kluczowym aspektem tworzenia responsywnych, atrakcyjnych stron internetowych. </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-gornictwa-podziemnego/GIW.09/" class="footer-link"> <span>GIW.09</span> <small class="text-muted">(306)</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-informatyk/EE8/" class="footer-link"> <span>EE8</span> <small class="text-muted">(859)</small> </a> </div> <div class="col-6"> <a href="/technik-renowacji-elementow-architektury/BUD.23/" class="footer-link"> <span>BUD.23</span> <small class="text-muted">(211)</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-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-technologii-zywnosci/SPC.07/" class="footer-link"> <span>SPC.07</span> <small class="text-muted">(231)</small> </a> </div> <div class="col-6"> <a href="/technik-renowacji-elementow-architektury/BUD.24/" class="footer-link"> <span>BUD.24</span> <small class="text-muted">(149)</small> </a> </div> <div class="col-6"> <a href="/technik-usug-fryzjerskich/FRK.01/" class="footer-link"> <span>FRK.01</span> <small class="text-muted">(1 485)</small> </a> </div> <div class="col-6"> <a href="/pracownik-pomocniczy-mechanika/MEC.06/" class="footer-link"> <span>MEC.06</span> <small class="text-muted">(382)</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>