Wyniki egzaminu

Nowy egzamin
Informacje o egzaminie:
  • Zawód: Technik programista
  • Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych
  • Data rozpoczęcia: 25 maja 2025 21:22
  • Data zakończenia: 25 maja 2025 21:54

Egzamin zdany!

Wynik: 37/40 punktów (92,5%)

Wymagane minimum: 20 punktów (50%)

Pochwal się swoim wynikiem!
Facebook
X.com
LinkedIn
Szczegółowe wyniki:
Pytanie 1

W CSS, aby określić typ czcionki, powinno się zastosować właściwość

A. font-family
B. font-face
C. font-style
D. font-size
Właściwość 'font-family' w CSS jest kluczowa dla określenia kroju czcionki, który ma być używany na stronie internetowej. Dzięki tej właściwości możemy wskazać jedną lub więcej czcionek, które będą stosowane dla danego elementu. Wartością może być nazwa konkretnej czcionki, na przykład 'Arial', lub rodzina czcionek, jak 'sans-serif'. Przykład użycia to: 'font-family: Arial, sans-serif;'. W przypadku braku dostępności danej czcionki, przeglądarka wybierze następną z listy, co pozwala na zapewnienie spójności i czytelności tekstu na różnych urządzeniach. Zgodnie z najlepszymi praktykami, zaleca się użycie kilku opcji czcionek, aby zapewnić lepszą dostępność. Warto również pamiętać, aby unikać stosowania zbyt wielu różnych krojów czcionek, co mogłoby wpływać negatywnie na estetykę i czytelność strony. Użycie 'font-family' w połączeniu z innymi właściwościami, takimi jak 'font-size' czy 'font-weight', pozwala na pełne dostosowanie wyglądu tekstu zgodnie z wymaganiami projektu.
Pytanie 2

Jakim znacznikiem można wprowadzić listę numerowaną (uporządkowaną) w dokumencie HTML?

A.
  • B.
      C.
        D.
        Znacznik
          służy do wstawiania list numerowanych (uporządkowanych) w dokumentach HTML. Jego zastosowanie pozwala na tworzenie list, gdzie każdy element jest automatycznie numerowany, co jest szczególnie przydatne w sytuacjach, gdy kolejność elementów ma znaczenie, na przykład w przepisach kulinarnych, instrukcjach czy krokach do wykonania. Warto pamiętać, że elementy listy umieszczane są w znaczniku
        1. , który określa każdy pojedynczy wpis na liście. Stosowanie znaczników zgodnych z zaleceniami W3C zapewnia, że strona jest zgodna z zasadami dostępności oraz ułatwia interpretację treści przez wyszukiwarki. Przykład użycia:
          1. Krok pierwszy
          2. Krok drugi
          , co wygeneruje numerowaną listę z dwoma krokami. Przestrzeganie standardów oraz dobrych praktyk w tworzeniu struktury HTML jest kluczowe dla zapewnienia przejrzystości i efektywności strony internetowej.
        Pytanie 3

        Język JavaScrypt umożliwia obsługę

        A. funkcji wirtualnych
        B. wysyłania ciastek z identycznymi informacjami do wielu klientów strony
        C. klas abstrakcyjnych
        D. obiektów DOM
        JavaScript to język programowania, który ma silne wsparcie dla obiektów DOM (Document Object Model), co pozwala na dynamiczne manipulowanie strukturą HTML oraz stylami CSS w czasie rzeczywistym. DOM jest interfejsem programowania aplikacji, który reprezentuje strukturę dokumentów HTML oraz XML jako zhierarchizowane drzewo obiektów. Dzięki JavaScript, programiści mogą dodawać, usuwać oraz modyfikować elementy na stronie internetowej, co prowadzi do interaktywnych i responsywnych doświadczeń użytkowników. Na przykład, za pomocą metody document.getElementById() można uzyskać dostęp do konkretnego elementu HTML, a następnie zmienić jego zawartość lub styl. Możliwości manipulacji DOM w JavaScript są szerokie, obejmują takie operacje jak dodawanie klas CSS, obsługa zdarzeń użytkownika, czy tworzenie nowych elementów. Standardy, takie jak W3C DOM, definiują sposób, w jaki te operacje powinny być realizowane, zapewniając interoperacyjność w różnych przeglądarkach. Zrozumienie obsługi DOM w JavaScript jest kluczowe dla każdego, kto chce tworzyć nowoczesne aplikacje internetowe, ponieważ umożliwia pełne wykorzystanie możliwości interakcji na stronach WWW.
        Pytanie 4

        Jaki wynik przyjmie zmienna a po zakończeniu pętli w podanym fragmencie kodu PHP?

        $i = 10; $a = 0;
        while ($i)
        {
            $a = $a + 2;
            $i--;
        }

        A. 10
        B. 0
        C. 20
        D. 2
        W podanym fragmencie kodu PHP zmienna a przyjmuje wartość 20 po zakończeniu pętli. Dzieje się tak, ponieważ pętla while wykonuje się, dopóki zmienna i jest różna od zera. Na początku i jest równe 10, a podczas każdej iteracji pętli zmienna a jest zwiększana o 2, a zmienna i jest dekrementowana o 1. W efekcie pętla wykonuje się dokładnie 10 razy, a w każdej iteracji wartość zmiennej a zwiększa się o 2. W rezultacie po 10 iteracjach zmienna a osiąga wartość 20. Takie podejście do pętli while jest często stosowane w programowaniu, gdy chcemy wykonać określoną liczbę iteracji, dopóki warunek logiczny jest spełniony. Jest to przykład dobrej praktyki, gdy kod jest czytelny i łatwy do zrozumienia. W praktyce programowania PHP pętle tego typu są używane do różnych operacji, takich jak przetwarzanie danych, iterowanie po elementach tablic, czy wykonywanie złożonych obliczeń, co ilustruje zrozumiałe i efektywne zastosowanie tej konstrukcji w PHP.
        Pytanie 5

        W CSS, co spowoduje poniższy kod z plikiem rysunek.png?

        p {background-image: url("rysunek.png");}

        A. pokazany obok każdego akapitu
        B. widoczny, jeśli zastosowany zostanie znacznik img w kodzie
        C. tłem całej witryny
        D. tłem dla każdego akapitu
        Wybrana odpowiedź jest poprawna ponieważ w arkuszach stylów CSS zastosowanie selektora elementu p z właściwością background-image powoduje że obraz rysunek.png zostanie ustawiony jako tło dla każdego elementu paragrafu na stronie. Jest to przydatna technika gdy chcemy nadać spójny wygląd wszystkim paragrafom w dokumencie. Tło to może być używane do celów estetycznych lub jako część identyfikacji wizualnej strony. Warto pamiętać że w CSS można dodatkowo kontrolować sposób wyświetlania obrazka tła za pomocą właściwości takich jak background-repeat background-size i background-position co pozwala na precyzyjne dostosowanie wyświetlania. Dobre praktyki zalecają aby obrazy tła były odpowiednio zoptymalizowane pod kątem rozmiaru aby nie wpływały negatywnie na szybkość ładowania strony. W praktyce stosowanie obrazów jako tła w paragrafach może wspierać wizualne narracje oraz zwiększać zaangażowanie użytkowników szczególnie gdy są stosowane w przemyślany sposób w kontekście projektowania doświadczeń użytkownika UX.
        Pytanie 6

        Znacznik tekst w HTML będzie ukazywany przez przeglądarkę w identyczny sposób, jak znacznik

        A.tekst
        B.

        tekst

        C. tekst
        D. tekst
        Znacznik w języku HTML jest używany do oznaczania tekstu, który ma być wyświetlany w sposób wyróżniony, co sugeruje jego większe znaczenie, natomiast znacznik jest używany tylko do pogrubienia tekstu, bez dodatkowego kontekstu semantycznego. Oba znaczniki są wizualnie identyczne w większości przeglądarek, co powoduje, że można je stosować zamiennie w niektórych przypadkach. Jednakże, zgodnie z najnowszymi standardami HTML, zaleca się używanie dla tekstu, który ma większe znaczenie, ponieważ to pomaga w SEO i dostępności. Na przykład, tekst umieszczony w znaczniku może być lepiej interpretowany przez technologie wspomagające, takie jak czytniki ekranu, co czyni go bardziej dostępnym dla osób z niepełnosprawnościami. Przykład użycia: ważne informacje w odróżnieniu od ważne informacje, gdzie znaczenie semantyczne jest pominięte. Dlatego, mimo że wizualnie nie widać różnicy, semantyka HTML jest kluczowym aspektem, który wpływa na sposób, w jaki treść jest interpretowana i przetwarzana przez różnorodne systemy.
        Pytanie 7

        To pytanie jest dostępne tylko dla zalogowanych użytkowników. Zaloguj się lub utwórz konto aby zobaczyć pełną treść pytania.

        Odpowiedzi dostępne po zalogowaniu.

        Wyjaśnienie dostępne po zalogowaniu.

        Pytanie 8

        Które z poniższych zapytań SQL zwróci wszystkie kolumny z tabeli 'produkty'?

        A. FETCH * FROM produkty;
        B. GET * FROM produkty;
        C. SELECT produkty FROM *;
        D. SELECT * FROM produkty;
        Zapytanie SQL, które zwraca wszystkie kolumny z tabeli, wykorzystuje składnię SELECT * FROM nazwa_tabeli. Gwiazdka (*) jest symbolem, który oznacza, że chcemy pobrać wszystkie kolumny z danej tabeli. Jest to bardzo przydatne, gdy chcemy szybko uzyskać pełne dane z tabeli bez konieczności wymieniania każdej kolumny z osobna. W praktyce często używa się tej składni w sytuacjach, gdy chcemy wykonać operacje diagnostyczne lub szybkie przeglądanie zawartości tabeli. Jednakże, w środowiskach produkcyjnych, zaleca się raczej precyzyjne określanie potrzebnych kolumn zamiast używania "*", ponieważ pozwala to na optymalizację zapytań i może zmniejszyć obciążenie bazy danych. Niemniej jednak, zapytanie SELECT * FROM produkty; jest poprawne i zgodne z SQL-owym standardem, co czyni je prawidłowym wyborem w tym kontekście.
        Pytanie 9

        Aby uzyskać przedstawiony efekt napisu w programie INKSCAPE / COREL, należy

        Ilustracja do pytania
        A. skorzystać z opcji wstaw / dopasuj tekst do ścieżki
        B. skorzystać z opcji gradientu
        C. zastosować opcję sumy z kołem
        D. zastosować opcję wykluczenia z kołem
        Funkcja wstaw lub dopasuj tekst do ścieżki w programach takich jak Inkscape czy CorelDRAW pozwala na kreatywne umieszczanie tekstu wzdłuż określonej linii lub krzywej co jest przydatne w projektowaniu graficznym gdzie częstym wymaganiem jest dostosowanie tekstu do nietypowych kształtów. Na przykład tworzenie logo gdzie napis musi okrążać okrąg lub być umieszczony wzdłuż linii falistej. Proces ten zaczyna się od stworzenia ścieżki którą może być zarówno linia prosta jak i bardziej złożona krzywa a następnie wybrania opcji dopasowania tekstu do tej ścieżki. Kluczowe jest by zrozumieć że taka ścieżka działa jak prowadnica dla tekstu który dostosowuje się do jej kształtu co pozwala na uzyskanie efektów trudnych do osiągnięcia tradycyjnymi metodami. Funkcja ta jest zgodna z dobrymi praktykami projektowania graficznego umożliwiając twórcom większą elastyczność i kreatywność w prezentacji tekstu. Jest to również standardowe narzędzie w pakietach do grafiki wektorowej co pozwala na łatwą edycję i skalowanie projektów bez utraty jakości co jest kluczowe w profesjonalnym designie.
        Pytanie 10

        W C++ stworzono zmienną: char zm1;. Jak można przypisać do niej wartość, zgodnie ze składnią tego języka?

        A. zm1 = "wiadro"
        B. zm1[2] = 32
        C. zm1 = 'w'
        D. zm1 == 0x35
        Odpowiedź 'zm1 = 'w';' jest prawidłowa, ponieważ w języku C++ zmienna typu char służy do przechowywania pojedynczego znaku. Przypisując wartość 'w', używamy pojedynczych apostrofów, co jest zgodne z syntaktyką C++. Przykładowo, możemy wykorzystać tę zmienną w programie do przechowywania litery, która następnie będzie mogła być użyta w różnych operacjach, takich jak wyświetlenie na ekranie czy do porównań. W dobrych praktykach programowania ważne jest, aby zmienne były odpowiednio zdefiniowane i przypisywane zgodnie z ich typami. Użycie char jest zalecane w sytuacjach, gdy potrzebujemy efektywnego przechowywania znaków, co jest kluczowe w optymalizacji pamięci. Innym przykładem może być tworzenie prostych gier tekstowych, w których każdy znak ma swoje znaczenie i wpływa na logikę gry. Oprócz tego, warto wspomnieć, że w C++ istnieją różne typy danych do przechowywania tekstów, jak string, ale dla pojedynczych znaków char jest najodpowiedniejszym typem.
        Pytanie 11

        W języku PHP, przy pracy z bazą MySQL, aby zakończyć sesję z bazą, należy wywołać

        A. mysqli_exit()
        B. mysqli_close()
        C. mysqli_rollback()
        D. mysqli_commit()
        Odpowiedź mysqli_close() jest prawidłowa, ponieważ ta funkcja jest używana do zamknięcia połączenia z bazą danych MySQL w języku PHP. Po zakończeniu wszystkich operacji na bazie danych, zaleca się wywołanie tej funkcji, aby zwolnić zasoby systemowe oraz zamknąć połączenie, co jest zgodne z dobrymi praktykami programistycznymi. Użycie mysqli_close() jest istotne, ponieważ niezamknięte połączenia mogą prowadzić do wycieków pamięci i wyczerpania dostępnych zasobów, co z kolei może wpłynąć na wydajność aplikacji. W praktyce, jeśli mamy otwarte połączenie z bazą danych, po zakończeniu operacji, takich jak pobieranie lub wstawianie danych, używamy mysqli_close($connection), gdzie $connection to nasza zmienna reprezentująca połączenie. Oprócz tego, pamiętajmy, że dbanie o odpowiednie zarządzanie połączeniami ma kluczowe znaczenie dla bezpieczeństwa i stabilności naszych aplikacji.
        Pytanie 12

        W kodzie HTML kolor biały można reprezentować przy użyciu wartości

        A. rgb (FF, FF, FF)
        B. #000000
        C. #255255
        D. rgb(255, 255, 255)
        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.
        Pytanie 13

        Jakim zapisem w języku PHP można określić komentarz, który rozciąga się na wiele linii?

        A. //
        B. #
        C.
        D. /*  */
        W języku PHP komentarz wieloliniowy definiuje się za pomocą zapisu /* */. Taki komentarz może obejmować wiele linii tekstu, co czyni go niezwykle przydatnym do opisywania fragmentów kodu, które są zbyt obszerne, by umieścić je w pojedynczej linii. Używanie komentarzy wieloliniowych pozwala programistom na dodawanie szczegółowych wyjaśnień dotyczących funkcji, algorytmów czy też sposobu działania poszczególnych sekcji kodu. Dobrą praktyką jest stosowanie takich komentarzy, aby ułatwić innym programistom zrozumienie kodu lub przypomnienie sobie samego siebie, co dany fragment robi. Przykładowo: /* Funkcja oblicza sumę dwóch liczb Parametr 1: pierwsza liczba Parametr 2: druga liczba Zwraca: suma obu liczb */ Ponadto, stosowanie komentarzy jest zgodne z zasadami programowania zorientowanego na zrozumiałość, które są kluczowe w projektach zespołowych oraz w długofalowym utrzymaniu kodu. Poprawne stosowanie komentarzy pomaga w dokumentowaniu kodu oraz w jego przyszłym rozwoju.
        Pytanie 14

        Interpreter PHP zgłosi błąd i nie zrealizuje kodu, jeśli programista:

        A. nie umieści średnika po wyrażeniu w instrukcji if, gdy po nim występuje sekcja else
        B. będzie pisać kod bez zastosowania wcięć
        C. będzie definiował zmienne w obrębie warunku
        D. pobierze dane z formularza, w którym pole input pozostało puste
        W przypadku instrukcji warunkowej if w PHP, każdy blok kodu, który jest wykonywany w przypadku prawdziwego warunku, powinien być poprawnie zakończony średnikiem, z wyjątkiem konstrukcji, które są wstawiane bezpośrednio w ramy instrukcji, jak else. Jeżeli programista nie postawi średnika po wyrażeniu if, a następnie użyje sekcji else, to interpreter PHP zgłosi błąd składniowy. Jest to istotne, ponieważ każda linia kodu w PHP, która wykonuje jakąkolwiek operację, musi być zakończona średnikiem, co jest standardową praktyką w językach programowania. Przykład poprawnej konstrukcji: if ($warunek) { // kod } else { // kod }. W przypadku braku średnika może to prowadzić do nieprzewidzianych błędów w kodzie, co z kolei wpłynie na stabilność aplikacji. Przestrzeganie takich zasad jest kluczowe dla osiągnięcia dobrej jakości kodu oraz jego łatwości w utrzymaniu.
        Pytanie 15

        Deklarując var x="true"; w języku JavaScript, jakiego typu zmienną się tworzy?

        A. Liczbowego
        B. Nieokreślonego (undefined)
        C. Logicznego
        D. String (ciąg znaków)
        Odpowiedź 'String (ciąg znaków)' jest poprawna, ponieważ w języku JavaScript zmienna zadeklarowana za pomocą 'var x="true";' przechowuje wartość typu tekstowego. Wartość 'true' jest traktowana jako ciąg znaków, ponieważ jest umieszczona w cudzysłowie. JavaScript jest językiem dynamicznie typowanym, co oznacza, że typ zmiennej jest określany w momencie przypisania wartości. W praktyce, ciągi znaków są powszechnie używane w programowaniu webowym do reprezentacji danych, takich jak teksty, komunikaty, a także do przetwarzania informacji z formularzy. Dobre praktyki obejmują użycie cudzysłowów pojedynczych lub podwójnych do definiowania ciągów, a także unikanie mieszania typów, co może prowadzić do błędów. Ważne jest, aby zawsze być świadomym typu danych, z którymi pracujemy, aby uniknąć nieoczekiwanych wyników w kodzie. Zrozumienie, jak JavaScript interpretuje różne typy danych, jest kluczowe dla efektywnego programowania oraz debugowania aplikacji.
        Pytanie 16

        Funkcję o nazwie policz, napisaną w PHP, wywołano z argumentem $Z = 1. Jaki wynik zostanie zwrócony? ```function policz($Z) { while($Z < 5) { $Z += 2 * $Z + 1; } return $Z; }```

        A. 13
        B. 1
        C. 7
        D. 4
        Funkcja 'policz' przyjmuje argument $Z, który w tym przypadku wynosi 1. Wewnątrz funkcji znajduje się pętla while, która wykonuje się tak długo, jak $Z jest mniejsze od 5. W każdym kroku pętli wartość $Z jest aktualizowana zgodnie z równaniem $Z += 2 * $Z + 1. Przy pierwszym wywołaniu pętli, $Z = 1, co daje nam $Z = 1 + 2 * 1 + 1 = 4. Wartość $Z jest teraz równa 4, co wciąż spełnia warunek pętli, więc pętla wykonuje się jeszcze raz. W drugiej iteracji, $Z = 4, więc $Z = 4 + 2 * 4 + 1 = 13. Teraz $Z jest większe od 5, co kończy działanie pętli. Funkcja zwraca wartość 13. Użycie pętli while w tym przypadku ilustruje, jak można implementować iteracyjne obliczenia w PHP, co jest kluczowe w programowaniu i pozwala na efektywne wykonywanie powtarzających się zadań. Praktyczne zastosowanie tej techniki obejmuje obliczenia, które wymagają wielokrotnego aktualizowania wartości, takie jak obliczenia statystyczne czy algorytmy przeszukiwania.
        Pytanie 17

        Przedstawiona funkcja napisana w kodzie JavaScript ma na celu:

        function oblicz(a, n)
        {
            wynik = 1;
            for(i = 0; i < n; i++)
                wynik *= a;
            return (wynik);
        }

        A. wpisać wyniki mnożenia a przez n
        B. zwrócić wynik potęgowania a^n
        C. wpisać kolejne liczby od a do n
        D. zwrócić iloczyn kolejnych liczb od 1 do a
        Przedstawiona funkcja nie zwraca iloczynu kolejnych liczb od 1 do a, ponieważ taka operacja wymaga iteracyjnego mnożenia zmiennych w rosnącym ciągu, co oznaczałoby konieczność użycia dwóch zmiennych jako zakresu pętli czy też dodawania kolejnych wartości, a nie prostego mnożenia przez stałą wartość. Odpowiedź mówiąca o wpisywaniu kolejnych liczb od a do n również nie jest poprawna, ponieważ funkcja nie wykorzystuje tablic ani nie przepisuje wartości w ten sposób do żadnej struktury danych. Kod nie zawiera mechanizmu iteracyjnego przydzielania wartości do zmiennej przechowującej liczby. W końcu, funkcja nie wpisuje wyników mnożenia a przez n bezpośrednio, ale realizuje operację arytmetyczną potęgowania poprzez mnożenie wyniku przez a n-krotnie. Takie podejście nie jest równoznaczne ze zwracaniem prostego iloczynu a * n, co oznaczałoby pojedyncze mnożenie dwóch liczb, a nie iteracyjne potęgowanie. Zrozumienie tego odróżnienia jest kluczowe w kontekście poprawnego interpretowania operacji matematycznych w programowaniu, zwłaszcza w kontekście implementacji algorytmów matematycznych i rozwiązywania problemów wymagających dokładnego modelowania operacji arytmetycznych. Pomyłki takie mogą prowadzić do błędnych wyników lub niewłaściwego stosowania kodu w praktycznych zastosowaniach informatycznych.
        Pytanie 18

        W bazie danych produkt znajdują się artykuły wyprodukowane po 2000 roku, zawierające pola nazwa oraz rok_produkcji. Klauzula SQL wyświetli zestawienie artykułów wyprodukowanych

        SELECT * FROM `produkt` WHERE
        SUBSTR(rok_produkcji, 3, 2) = 17;

        A. po roku 2017
        B. w latach innych niż 2017
        C. przed rokiem 2017
        D. w roku 2017
        W tej klauzuli SQL, co widzimy, filtrujemy dane z tabeli produkt. Użycie funkcji SUBSTR(rok_produkcji, 2) pozwala nam wyciągnąć dwie ostatnie cyfry z roku produkcji. To jest super przydatne, bo dzięki temu możemy uzyskać rok w formacie dwu-cyfrowym. Jak porównujemy to z 17, to znaczy, że szukamy rekordów, których rok produkcji kończy się na 17, co odpowiada pełnemu roku, czyli 2017. Takie podejście ma sens, gdy chcemy szybko przeszukać dane dotyczące konkretnego roku, nie bawiąc się w cały numer. Umiejętność korzystania z funkcji tekstowych w SQL, jak SUBSTR, jest naprawdę istotna w analizie danych, szczególnie gdy struktura tabeli nie pozwala na łatwe użycie wartości liczbowych. Ludzie pracujący z bazami danych powinni znać te sztuczki, bo to pozwala na lepsze dopasowanie filtracji danych do potrzeb. Fajne jest też dokumentowanie takich zapytań, żeby inni mogli zrozumieć, o co chodzi.
        Pytanie 19

        Wskaż przycisk sformatowany przedstawionym stylem CSS.

        #przycisk {
    background-color: white;
    padding: 10px;
    border-width: 2px;
    border-bottom-style: dashed;
}



        Przycisk 1

        Przycisk 2

        Przycisk 3

        Przycisk 4

        A. Przycisk 4
        B. Przycisk 1
        C. Przycisk 2
        D. Przycisk 3
        Przycisk 2 jest jedynym, który spełnia wszystkie warunki określone w podanym stylu CSS. Białe tło, odstęp wewnętrzny 10 pikseli, szerokość obramowania 2 piksele oraz przerywana dolna krawędź obramowania są elementami, które zostały ustawione w stylach CSS dla przycisku 2. Ta wiedza jest niezwykle przydatna przy projektowaniu i tworzeniu stron internetowych, gdzie kształtowanie elementów interaktywnych, takich jak przyciski, jest często kluczowym elementem doświadczenia użytkownika. Pamiętaj, że CSS pozwala na dużą swobodę w dostosowywaniu wyglądu poszczególnych elementów strony, a zrozumienie, jak działa selekcja elementów i stylizacja, to fundamenty tworzenia atrakcyjnych i funkcjonalnych projektów webowych. Zrozumienie, jakie style zostały zastosowane do danego elementu, pozwala na szybkie i efektywne dostosowywanie strony do potrzeb klienta.
        Pytanie 20

        W celu przyznania użytkownikowi w systemie MySQL możliwości nadawania i modyfikowania uprawnień innym użytkownikom, konieczne jest użycie klauzuli

        A. ALL PRIVILEGES
        B. GRANT OPTION
        C. FLUSH PRIVILEGES
        D. TRGGER
        Aby w systemie MySQL nadać użytkownikowi prawo do nadawania i zmiany uprawnień innym użytkownikom, należy zastosować klauzulę GRANT OPTION. Ta klauzula jest istotnym elementem systemu zarządzania uprawnieniami, ponieważ umożliwia użytkownikowi, który posiada określone uprawnienia, dzielenie się nimi z innymi użytkownikami. Oznacza to, że użytkownik z GRANT OPTION ma prawo nie tylko do wykonania pewnych działań, ale także do przekazywania tych uprawnień innym, co jest kluczowe w zarządzaniu dużymi bazami danych, gdzie konieczne jest delegowanie zadań. Przykład użycia klauzuli GRANT OPTION może wyglądać następująco: 'GRANT SELECT, INSERT ON my_database.* TO 'user1'@'localhost' WITH GRANT OPTION;', co daje użytkownikowi 'user1' prawo do wykonywania operacji SELECT i INSERT oraz możliwość przekazywania tych uprawnień innym użytkownikom. Taki mechanizm jest fundamentalny dla utrzymania hierarchii uprawnień i bezpieczeństwa w bazach danych, co jest zgodne z najlepszymi praktykami w zarządzaniu dostępem do danych.
        Pytanie 21

        Aby stworzyć stronę internetową, która będzie odpowiadać załączonej ilustracji, konieczne jest użycie semantycznych znaczników sekcji w języku HTML5. Jakim znacznikiem należy określić sekcję menu?

        A. header
        B. aside
        C. nav
        D. div
        Znacznik
        Pytanie 22

        Jakim słowem kluczowym w języku z rodziny C można przypisać alternatywną nazwę dla już istniejącego typu danych?

        A. union
        B. switch
        C. typedef
        D. enum
        Słowo kluczowe 'typedef' w języku C służy do definiowania alternatywnych nazw dla istniejących typów danych. Dzięki temu programiści mogą tworzyć bardziej czytelny i zrozumiały kod, który jest łatwiejszy w utrzymaniu. Na przykład, jeśli mamy złożony typ danych, taki jak struktura, możemy użyć 'typedef', aby uprościć jego użycie w kodzie. Przykład użycia: 'typedef struct { int x; int y; } Point;' pozwala na użycie 'Point' zamiast 'struct { int x; int y; }' w dalszej części programu, co zwiększa czytelność. Ponadto, stosowanie 'typedef' jest zgodne z najlepszymi praktykami programowania w C, które rekomendują jasność i zwięzłość kodu. Używanie alternatywnych nazw może również ułatwić późniejsze modyfikacje kodu, ponieważ zmiana definicji typu danych w jednym miejscu automatycznie propaguje zmiany w całym kodzie, co jest istotne w większych projektach. Przykłady zastosowania 'typedef' można znaleźć w bibliotekach C, gdzie definiuje się typy dla wskaźników czy tablic, co przyczynia się do lepszego zrozumienia kodu. Warto zaznaczyć, że 'typedef' nie zmienia samego typu danych, a jedynie wprowadza nową nazwę, co jest kluczowe dla zachowania zgodności z normami języka.
        Pytanie 23

        Który z poniższych zapisów CSS zmieni tło bloku na odcień niebieskiego?

        A. div {border-color:blue;}
        B. div {background-color:blue;}
        C. div {shadow:blue;}
        D. div {color:blue;}
        Zapis 'div {background-color:blue;}' jest jak najbardziej na miejscu. Właściwość 'background-color' jest kluczowa, bo ustawia kolor tła dla elementów blokowych w CSS. Kiedy używasz 'blue' jako wartości, to mówisz, że tło ma być niebieskie. Ta właściwość jest częścią tego całego systemu CSS, który decyduje, jak powinny wyglądać elementy HTML. Ustawienie koloru tła jest ważne, bo wpływa na wygląd strony i to, jak kontrastują ze sobą tekst i tło, co jest istotne, by strona była dostępna dla każdego. Jeśli chciałbyś zmienić kolor tła, możesz korzystać z różnych wartości, takich jak kody HEX (np. #0000FF) albo RGB (np. rgb(0, 0, 255)). Możesz to zobaczyć w praktyce, na przykład:
        Treść
        , co ustawi tło 'diva' na niebieskie.
        Pytanie 24

        Jakie cechy powinien posiadać klucz główny?

        A. Reprezentowany jest przez jedno pole tabeli, jego wartość nie może ulegać zmianie
        B. Nie może przybierać wartości, reprezentowany jest przez dokładnie jedno pole tabeli
        C. Jest unikatowy, nie może zawierać pustych wartości
        D. Jest unikatowy, może mieć tylko wartości całkowite
        Odpowiedź wskazująca, że klucz główny jest unikatowy i nie może przyjmować pustych wartości jest absolutnie poprawna. Klucz główny w relacyjnych bazach danych pełni kluczową rolę w identyfikacji unikalnych rekordów w tabeli. Jego unikalność zapewnia, że każdy wiersz w tabeli można jednoznacznie zidentyfikować, co jest kluczowe dla utrzymania integralności danych. Na przykład, w tabeli użytkowników, identyfikator użytkownika (user_id) może pełnić rolę klucza głównego, co pozwala na łatwe wyszukiwanie i powiązanie danych z innymi tabelami, takimi jak zamówienia czy posty. Standardy takie jak ISO/IEC 9075 (SQL) podkreślają znaczenie kluczy głównych w projektowaniu baz danych. Dodatkowo, dobrym zwyczajem jest, aby kolumny będące kluczami głównymi były także oznaczone jako NOT NULL, co zapobiega wprowadzeniu pustych wartości, a tym samym zapewnia integralność danych. Zrozumienie tego konceptu jest niezbędne dla każdego, kto projektuje lub zarządza bazami danych, ponieważ błędy w definicji kluczy głównych mogą prowadzić do poważnych problemów z integralnością danych.
        Pytanie 25

        Jaką cechę pola w tabeli należy ustalić, aby pole mogło przyjmować wyłącznie dane składające się z cyfr?

        Ogólne
        Rozmiar pola255
        Format
        Maska wprowadzania
        Tytuł
        Wartość domyślna
        Reguła spr. poprawności
        Tekst reguły spr. poprawności
        WymaganeNie
        Zerowa dł. dozwolonaTak
        IndeksowaneNie
        Kompresja UnicodeTak
        Tryb IMEBez formantu
        Tryb zdania edytora IMEBrak
        Tagi inteligentne

        A. Tagi inteligentne
        B. Regułę sprawdzania poprawności
        C. Maskę wprowadzania
        D. Wartość domyślną
        Maska wprowadzania to coś, co bardzo ułatwia życie, zwłaszcza w systemach baz danych i aplikacjach. Dzięki niej możemy dokładnie określić, jakie znaki mogą być wpisywane w dane pole, co jest szczególnie przydatne, gdy potrzebujemy tylko cyfr. Wyobraź sobie, że musisz wpisać numer telefonu – to właśnie wtedy maska pokazuje, że możesz wpisać tylko cyfry i może nawet dodać myślniki dla lepszej estetyki. To dobry sposób na ograniczenie błędów, bo nikt nie będzie miał okna do wpisania literek, których nie powinno być. W praktyce, jeżeli projektujesz coś jak formularze online, to maseczki wprowadzania są bardzo fajne, bo zabezpieczają dane przed wprowadzeniem czegokolwiek, co nie pasuje. Możesz je łatwo zaimplementować w językach programowania jak C# czy JavaScript przy pomocy wyrażeń regularnych albo gotowych komponentów UI. Dobrze zaprojektowane maski wprowadzania pomagają też utrzymać porządek w bazach danych i zgodność z wymaganiami, które mamy na myśli.
        Pytanie 26

        Dla dowolnego a z przedziału (0, 99) zadaniem funkcji zapisanej w języku JavaScript jest

        function fun1(a)
{
    for (n = a; n <= 100; n++)
        document.write(n);
    return n;
}

        A. wypisanie liczb z przedziału a .. 100 i zwrócenie wartości zmiennej n
        B. wypisanie liczb z przedziału a .. 99 i zwrócenie wartości 100
        C. zwrócenie liczb z przedziału a .. 99
        D. wypisanie wartości zmiennej a oraz zwrócenie wartości zmiennej n
        Twoja odpowiedź jest poprawna. Funkcja fun1(a) w języku JavaScript przyjmuje argument a i za pomocą pętli for wypisuje liczby od a do 100 włącznie - a więc pętla jest iterowana tyle razy, ile wynosi różnica między 100 a wartością argumentu a. Po każdej iteracji pętli, wartość zmiennej n jest zwiększana o 1, co jest typowym zachowaniem dla pętli for w JavaScript. Funkcja zwraca wartość zmiennej n po zakończeniu pętli. Tak więc funkcja zwraca 101, ponieważ to właśnie wartość o 1 większa niż warunek kończący pętlę (100) spowoduje jej zakończenie. Ta funkcja to przykładowe zastosowanie pętli for w JavaScript, pokazujące praktyczne zastosowanie tego elementu składni. Pętla for jest standardem w branży i jest powszechnie stosowana do iterowania przez elementy tablicy, obiekty, liczby i inne struktury danych.
        Pytanie 27

        Poniżej znajduje się fragment kodu w języku HTML. Przedstawia on definicję listy:

        Ilustracja do pytania
        A. C
        B. A
        C. D
        D. B
        Odpowiedź C jest poprawna ponieważ przedstawiony fragment kodu HTML definiuje uporządkowaną listę zagnieżdżoną W tym kodzie zauważamy że główna lista jest uporządkowana oznaczona jako ol co definiuje elementy listy jako numerowane po kolei Elementy li w tej liście to punkty jeden dwa i trzy Na szczególną uwagę zasługuje fakt że drugi element li zawiera zagnieżdżoną nieuporządkowaną listę ul co jest zgodne ze standardami HTML dotyczącymi zagnieżdżania list Zgodnie z dobrymi praktykami zagnieżdżanie list w HTML powinno być stosowane w sposób przejrzysty i logiczny co ułatwia czytelność i zrozumienie kodu oraz jego późniejsze modyfikacje Praktycznym zastosowaniem takich struktur jest organizowanie treści w dokumentach internetowych w sposób hierarchiczny co ułatwia zarówno użytkownikom przeglądanie zawartości jak i programistom zarządzanie kodem Zrozumienie zagnieżdżania list jest kluczowe dla efektywnego tworzenia stron internetowych które są nie tylko estetyczne ale także funkcjonalne i dostępne dla szerokiej grupy odbiorców
        Pytanie 28

        W języku JavaScript właściwie zdefiniowana zmienna to

        A. imie2
        B. imię2
        C. #imie
        D. imię%
        W języku JavaScript, poprawne nadawanie zmiennych jest kluczowym elementem programowania, który opiera się na zdefiniowanych zasadach dotyczących identyfikatorów. Zmienna musi zaczynać się od litery, znaku podkreślenia (_) lub znaku dolara ($), a następnie może zawierać litery, cyfry, znaki podkreślenia oraz znaki dolara. W przypadku odpowiedzi 'imie2', zaczyna się ona od litery i zawiera literę oraz cyfrę, co czyni ją poprawnym identyfikatorem. Zgodnie ze standardem ECMAScript, identyfikatory są rozróżniane na wielkie i małe litery, co oznacza, że 'Imie2' i 'imie2' będą traktowane jako różne zmienne. Praktycznym przykładem poprawnego użycia takiej zmiennej może być zapis: let imie2 = 'Jan'; console.log(imie2);. W wyniku tego, konsola wyświetli 'Jan'. Można również zauważyć, że zgodnie z zasadami, zmienne mogą być oznaczone jako let, const lub var, co dodaje elastyczności podczas deklaracji zmiennych w kodzie JavaScript.
        Pytanie 29

        W JavaScript metoda getElementById odnosi się do

        A. znacznika HTML o wskazanym id
        B. klasy zdefiniowanej w CSS
        C. znacznika HTML o podanej nazwie klasy
        D. zmiennej numerycznej
        Metoda getElementById w JavaScript jest kluczowym narzędziem do interakcji z modelowaniem DOM (Document Object Model). Służy do uzyskiwania dostępu do pojedynczego elementu HTML na podstawie jego atrybutu id, co jest zgodne z zasadą unikalności identyfikatorów w dokumencie HTML. Dzięki temu programiści mogą stosunkowo łatwo manipulować pojedynczymi elementami, co jest istotne w dynamicznych aplikacjach internetowych. Przykładem zastosowania tej metody może być zmiana tekstu w elemencie

        , gdzie używamy getElementById('myHeader').innerHTML = 'Nowy nagłówek';. Zgodnie z dobrymi praktykami, powinno się unikać używania zduplikowanych id w dokumencie, aby zapewnić, że metoda ta zawsze zwraca jeden, a nie wiele elementów. Warto również pamiętać, że w przypadku braku elementu o podanym id, metoda zwróci null, co powinno być uwzględnione w logice aplikacji, aby uniknąć błędów. Użycie tej metody jest standardem w programowaniu JavaScript i stanowi fundament dla wielu bardziej zaawansowanych technik manipulacji DOM.

        Pytanie 30

        Który zapis w języku JavaScript daje taki sam wynik jak poniższy kod?

        x = 0;
        x += 10;

        A. x = 10; x = 0
        B. x = 0; x++; x = x + 9
        C. x = 10; x = x + 10
        D. x = 0; x--; x *= 9
        Odpowiedź, która została wybrana, jest poprawna, ponieważ wykonuje dokładnie te same operacje na zmiennej x, co pierwotny kod. Przypisanie x = 0; ustawia wartość x na 0, a następnie x++; zwiększa wartość x o 1, co daje 1. Następnie, dodając 9 do x za pomocą x = x + 9, otrzymujemy 10. Tak więc końcowa wartość zmiennej x wynosi 10, co jest zgodne z wynikiem oryginalnego zapisu x += 10, który również prowadzi do wartości 10. W praktyce, takie podejście jest zgodne z zasadami programowania, gdzie użycie operatorów inkrementacji i przypisania jest powszechną praktyką. Poprawne zarządzanie zmiennymi i ich modyfikacja przy pomocy operatorów to kluczowy aspekt pisania efektywnego i łatwego do zrozumienia kodu w JavaScript. Pamiętaj, aby korzystać z takich konstrukcji, gdyż są one nie tylko czytelne, ale również optymalne.
        Pytanie 31

        Jakie informacje można wyciągnąć z podanego zapisu w języku HTML 5?

        A. Pojawi się na karcie dokumentu w przeglądarce
        B. Stanowi jedynie informację dla robotów wyszukiwania i nie jest widoczny w przeglądarce
        C. Jest fakultatywny w kontekście HTML 5 i nie jest wymagany w dokumencie
        D. Zostanie umieszczony w treści strony, na samym czubku
        Odpowiedzi, które sugerują, że zawartość znacznikanie jest widoczna w przeglądarce czy że nie ma znaczenia dla zawartości strony, są po prostu błędne. Zapis <title> to kluczowy element w HTML, który informuje użytkownika o tematyce strony, ale też wpływa na to, jak jest postrzegana przez wyszukiwarki. Tytuł nie jest w treści strony, a w nagłówku karty przeglądarki oraz w wynikach wyszukiwania. Ignorowanie tytułu to częsty błąd w myśleniu o SEO i projektowaniu stron. Można też usłyszeć, że <title> jest opcjonalny, co jest nieprawdą, bo brak tego elementu może sprawić, że użytkownicy i roboty wyszukiwarek będą mieli problem z identyfikacją strony. Tytuł musi być w kodzie HTML, żeby zwiększyć użyteczność i dostępność strony. Warto też pamiętać, że <title> nie jest tylko dla robotów, ale przede wszystkim ma pomóc użytkownikom zrozumieć, co mogą znaleźć na stronie. </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-definicje-tabeli-ktory-rys-8577057e" 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 HTML stworzono definicję tabeli. Który z rysunków ilustruje jej działanie?</p> <figure class="figure mt-3"> <img src="/images/6481.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. Rysunek 2</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. Rysunek 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>C. Rysunek 4</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. Rysunek 3</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Prawidłowa odpowiedź to Rysunek 1 ponieważ odwzorowuje on strukturę tabeli opisaną w kodzie HTML zaprezentowanym w pytaniu. Kod HTML przedstawia tabelę z dwoma wierszami. Pierwszy wiersz zawiera dwie komórki z tekstami 'pierwszy' i 'drugi'. Drugi wiersz posiada jedną komórkę z tekstem 'trzeci' która zajmuje szerokość dwóch kolumn dzięki zastosowaniu atrybutu colspan=2. Właśnie ta cecha sprawia że drugi rysunek jest poprawny gdyż w nim komórka z tekstem 'trzeci' rozciąga się na szerokość dwóch kolumn tabeli. Takie podejście jest zgodne z zasadami projektowania tabel w HTML gdzie atrybut colspan pozwala na łączenie kolumn co jest szczególnie przydatne przy tworzeniu złożonych układów danych w tabelach. Dzięki zastosowaniu tego atrybutu można efektywnie zarządzać szerokością komórek i ich położeniem co zwiększa elastyczność w projektowaniu układów na stronach internetowych. Warto zwrócić uwagę na fakt że użycie atrybutu 'border' z wartością 1 powoduje wyświetlenie widocznej ramki co jest dobrze zilustrowane na Rysunku 1. Zrozumienie i umiejętne zastosowanie takich technik w projektowaniu stron jest kluczowe dla tworzenia przejrzystych i funkcjonalnych interfejsów użytkownika. </div> </div> </article> <hr class="my-4"> <article class="mb-4"> <!-- Pytanie --> <div class="mb-3"> <div class="d-flex justify-content-between align-items-start mb-3"> <h6 class="mb-0">Pytanie 33</h6> <div class="d-inline-block"> <button type="button" class="btn btn-sm btn-outline-danger" data-report-question="w-jezyku-php-zapis-umozliwia-4f94a9a0" 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 PHP zapis // służy do</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. dodawania komentarza wieloliniowego</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. dodawania komentarza jednoliniowego</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. zastosowania operatora dzielenia bez reszty</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. używania tablicy superglobalnej</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Znak // w języku PHP jest używany do wstawiania komentarzy jednoliniowych. Oznacza to, że wszystko, co znajduje się po tym znaku na danej linii, zostanie zignorowane przez interpreter PHP. Komentarze są istotnym elementem programowania, ponieważ umożliwiają programistom dodawanie wyjaśnień i notatek do kodu, co znacznie ułatwia jego późniejsze zrozumienie i konserwację. Przykładowo, możesz użyć komentarza jednoliniowego, aby wyjaśnić określoną funkcjonalność w kodzie: // To jest funkcja obliczająca sumę. Warto również pamiętać, że stosowanie komentarzy jest standardową praktyką w branży, która zwiększa czytelność i jakość kodu. Dobrą praktyką jest stosowanie komentarzy, aby wyjaśniać bardziej złożone fragmenty kodu, co wpływa na łatwiejsze współdzielenie pracy w zespołach programistycznych, a także na przyszłe modyfikacje kodu przez innych programistów. Warto zaznaczyć, że PHP obsługuje także komentarze wieloliniowe, które zaczynają się od /* i kończą na */. Jednak dla prostych, jednozdaniowych notatek znak // jest najbardziej odpowiedni. </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="na-tabeli-dania-ktorej-wiersze-zostay-pokazane-n-4f11bdd0" 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 przedstawionej tabeli dotyczącej dań, wykonano kwerendę <table style="border: 2px solid black; border-collapse: collapse;"> <tr> <td style="border: 1px solid black; padding: 10px; font-family: monospace;">SELECT * FROM dania WHERE typ < 3 AND cena < 30 LIMIT 5; </td> </tr> </table> Ile wierszy zostanie zwróconych przez tę kwerendę?</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 bg-success bg-opacity-10 text-success "> <div class="flex-grow-1"> <span>A. 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>B. 8</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. 13</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. 5</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 błędnych odpowiedzi często wynika z nieprawidłowego zrozumienia warunków filtracji danych w zapytaniach SQL. Odpowiedzi takie jak 5, 8 oraz 13 mogą sugerować, że osoba udzielająca odpowiedzi nie dostrzega kluczowych ograniczeń nałożonych przez zapytanie. Po pierwsze, kwerenda ogranicza wynik do tych pozycji, które mają typ mniejszy niż 3 oraz cenę mniejszą niż 30. W odpowiedzi 5, na przykład, można błędnie założyć, że więcej pozycji spełnia te warunki, jednak po dokładnej analizie danych z tabeli tylko dwie pozycje (Gazpacho i Krem z warzyw) są zgodne z tymi kryteriami. Kolejna odpowiedź sugerująca 8 również popełnia błąd w ocenie, ponieważ nie uwzględnia dodatkowych ograniczeń dotyczących ceny. Ostatecznie odpowiedź 13, wskazująca na bezpośrednią liczbę wszystkich wierszy w tabeli, jest całkowicie mylna, ponieważ nie uwzględnia żadnych filtrów. W praktyce, kluczowym krokiem w efektywnym korzystaniu z SQL jest umiejętność precyzyjnego określania warunków, co pozwala na uzyskanie tylko tych danych, które są naprawdę potrzebne. Warto zwrócić uwagę na to, że prawidłowe zrozumienie tych zasad jest podstawą do analizy danych i podejmowania decyzji opartych na rzeczywistych informacjach. </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="wsrod-czterech-podstawowych-kolorow-modelu-barw-c-f834c059" 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 czterech głównych kolorów w modelu barw CMYK jest</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. zielony</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. czarny</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. brązowy</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. pomarańczowy</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Model barw CMYK, który jest stosowany głównie w druku, opiera się na czterech podstawowych kolorach: cyjan (C), magenta (M), żółty (Y) oraz czarny (K). Kolor czarny w tym modelu jest kluczowy, ponieważ pozwala na uzyskanie głębszych odcieni i kontrastów, które są trudne do osiągnięcia tylko przy użyciu pozostałych trzech kolorów. W praktyce, stosowanie czarnego tuszu umożliwia również oszczędność na kosztach, gdyż zamiast mieszać kolory, można po prostu nałożyć czarny tusz. Czarny kolor pełni również rolę tzw. "kontrastu" w projektach graficznych, co czyni go niezastąpionym w procesach drukarskich, szczególnie w kontekście druku tekstu oraz wyraźnych detali. Standardy ISO oraz różne normy drukarskie podkreślają znaczenie czarnego tuszu w procesach produkcji, co czyni go fundamentalnym elementem każdej pracy graficznej, która ma być drukowana. Dodatkowo, czarny kolor w modelu CMYK jest także używany do stworzenia ciemniejszych odcieni poprzez nakładanie go na inne kolory, co daje szeroki zakres możliwości twórczych." </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="w-procesie-przygotowywania-grafiki-na-strone-inter-12a8aa91" 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>Podczas przygotowywania grafiki na stronę internetową konieczne jest wycięcie jedynie określonego fragmentu. Jak nazywa się ta operacja?</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. kadrowanie.</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. łączenie warstw.</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. lustrzane odbicie obrazu.</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. zmiana rozmiaru.</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Kadrowanie to proces polegający na wycinaniu fragmentu obrazu w celu skupienia uwagi na określonym elemencie lub poprawienia kompozycji. W kontekście grafiki internetowej, kadrowanie jest kluczowe, aby dostosować zdjęcia do wymagań wizualnych strony, zachowując jednocześnie wysoką jakość obrazu. Przykładowo, jeśli tworzymy stronę dla restauracji, możemy wyciąć fragment zdjęcia dania, aby lepiej zaprezentować jego szczegóły. Dobre praktyki w kadrowaniu obejmują stosowanie zasady trzech, która polega na umiejscowieniu kluczowych elementów obrazu w punktach przecięcia linii podziału. Warto również pamiętać o rozdzielczości i proporcjach, aby uniknąć rozmycia lub zniekształcenia obrazu. Kadrowanie jest często używane w różnych formatach wizualnych, takich jak posty w mediach społecznościowych, banery reklamowe czy galerie zdjęć. W ten sposób, odpowiednie kadrowanie przyczynia się do lepszej prezentacji treści oraz poprawia estetykę i przejrzystość strony internetowej. </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="na-rysunku-pokazano-schemat-rozmieszczenia-blokow-c96590b7" 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 schemat rozmieszczenia elementów na stronie WWW. W której z jej sekcji zazwyczaj znajduje się stopka strony?</p> <figure class="figure mt-3"> <img src="/images/11123.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. 4</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. 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>C. 2</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. 5</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> Odpowiedź 5 jest poprawna ponieważ w standardach projektowania stron internetowych stopka strony zazwyczaj znajduje się na dole każdej podstrony. Stopka to miejsce gdzie umieszczane są informacje takie jak prawa autorskie prywatność i linki do kontaktu. Dobrze zaprojektowana stopka może także zawierać skróty nawigacyjne które pomagają użytkownikowi szybko przemieszczać się po stronie. W praktyce projektanci stron WWW stosują podejście oparte na responsywnym designie co oznacza że stopka powinna być łatwo dostępna i czytelna na różnych urządzeniach. Wykorzystanie CSS Grid lub Flexbox pozwala na elastyczne zarządzanie układem strony co jest szczególnie przydatne przy projektowaniu stopki. Ponadto stopki są elementami które odpowiadają za spójność wizualną całej strony internetowej zapewniając użytkownikowi intuicyjne doświadczenie. Umieszczanie stopki w dolnej części strony jest zgodne z oczekiwaniami użytkowników co zwiększa użyteczność serwisu i pozytywnie wpływa na jego odbiór. Praktyczne zastosowanie tego podejścia można zauważyć na wielu profesjonalnych stronach gdzie stopka jest wyraźnie oddzielona i przejrzysta co ułatwia użytkownikowi odnalezienie potrzebnych informacji. </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="tabela-filmy-zawiera-klucz-gowny-id-oraz-klucz-ob-7a2008d8" aria-label="Zgłoś błąd"> <i class="fas fa-exclamation-triangle"></i> </button> </div> </div> <!-- Wyświetl pełną treść pytania dla widocznych pytań --> <p>Tabela filmy dysponuje kluczem głównym id oraz kluczem obcym rezyserlD. Tabela rezyserzy posiada klucz główny id. Obie tabele są połączone relacją jeden do wielu, gdzie rezyserzy są po stronie jeden, a filmy po stronie wiele. Jak należy zapisać kwerendę SELECT, aby połączyć tabele filmy i rezyserzy?</p> </div> <!-- Odpowiedzi --> <div class="mb-3"> <!-- Wyświetl odpowiedzi dla widocznych pytań --> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>A. ... filmy JOIN rezyserzy ON filmy.id = rezyserzy.id ...</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>B. ... filmy JOIN rezyserzy ON filmy.rezyserlD = rezyserzy.filmylD ...</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. ... filmy JOIN rezyserzy ON filmy.rezyserlD = rezyserzy.id ...</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. ... filmy JOIN rezyserzy ON filmy.id = rezyserzy.filmylD ...</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ź: '... filmy JOIN rezyserzy ON filmy.rezyserlD = rezyserzy.id ...' jest zgodna z zasadami łączenia tabel w relacyjnych bazach danych. W tym przypadku 'rezyserlD' jest kluczem obcym w tabeli 'filmy', który odnosi się do 'id' w tabeli 'rezyserzy', co oznacza, że jeden reżyser może być przypisany do wielu filmów. Dzięki temu połączeniu możemy uzyskać informacje o filmach razem z danymi reżyserów. W praktyce, aby uzyskać szczegółowe informacje o filmach oraz ich reżyserach, takie zapytanie umożliwia efektywne łączenie danych, co jest kluczowe w aplikacjach bazodanowych, które wymagają integracji danych z różnych źródeł. Zastosowanie kluczy obcych w relacyjnych bazach danych jest standardem i pozwala na zapewnienie integralności danych, a także optymalizację zapytań. Dobrą praktyką jest również dbałość o odpowiednie nazewnictwo kolumn, aby jasno wskazywały one na ich przeznaczenie oraz relacje między tabelami, co znacząco ułatwia późniejszą pracę z bazą. </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="w-ktorej-technologii-ustrongnie-jest-mozliwe-fa3e1522" 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 jakiej technologii <u><strong>nie zachodzi</strong></u> możliwość przetwarzania danych wprowadzanych przez użytkowników na stronach internetowych?</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. PHP</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. JavaScript</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. CSS</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. AJAX</span> </div> </div> </div> </div> <!-- Feedback --> <div class="mt-3"> <!-- Wyświetl feedback dla widocznych pytań --> <div class="alert alert-success mb-0"> CSS (Cascading Style Sheets) to język stylów, który służy do opisywania wyglądu i formatu dokumentów HTML. Jego głównym celem jest kontrolowanie układu, kolorów, czcionek oraz innych aspektów wizualnych strony internetowej. CSS nie ma możliwości przetwarzania danych wprowadzanych przez użytkowników, gdyż nie posiada funkcji logiki programistycznej ani operacji na danych. Przykładowo, CSS może zmieniać kolor tła lub rozmiar tekstu, ale nie może zbierać informacji z formularzy ani reagować na interakcje użytkownika w sposób, w jaki robią to języki programowania takie jak JavaScript czy PHP. Może to prowadzić do mylnych przekonań, że CSS jest bardziej wszechstronny, niż jest w rzeczywistości, jednak jego zastosowanie ogranicza się wyłącznie do aspektów stylistycznych. W praktyce, aby przetwarzać dane użytkownika, niezbędne są inne technologie, które mogą współpracować z CSS, ale same w sobie nie są w stanie tego zrobić. </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="jaki-wynik-zwroci-zapytanie-z-ramki-wykonane-na-p-3015a635" 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>Jaką wartość zwróci zapytanie z ramki wykonane na pokazanej tabeli? ```SELECT COUNT(DISTINCT wykonawca) FROM muzyka;```</p> <figure class="figure mt-3"> <img src="/images/11086.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. 3</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. 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>C. 4</span> </div> </div> </div> <div class="mb-3"> <div class="d-flex align-items-start p-2 rounded border border-1 border-secondary "> <div class="flex-grow-1"> <span>D. 0</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 COUNTDISTINCT wykonawca) FROM muzyka; ma na celu zliczenie unikalnych wartości w kolumnie wykonawca tabeli muzyka. W tym przypadku w tabeli są trzy różne wartości w tej kolumnie: Czesław Niemen Stan Borys i Mikołaj Czechowski. Funkcja COUNTDISTINCT zwraca liczbę niepowtarzających się wykonawców co w tym zestawie danych daje wynik 3. Zrozumienie użycia funkcji COUNTDISTINCT jest kluczowe w analizie danych szczególnie gdy chcemy określić liczebność unikalnych elementów w dużych zbiorach danych. To podejście jest szeroko stosowane w raportowaniu i analizach biznesowych gdzie istotne jest zidentyfikowanie niepowtarzalnych wpisów na przykład liczby unikalnych klientów czy produktów w sklepie. Dobre praktyki w SQL obejmują używanie aliasów w celu zwiększenia czytelności zapytań oraz optymalizację wydajności przez właściwe indeksowanie kolumn które są często wykorzystywane w funkcjach zliczających. </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-robot-wykonczeniowych-w-budownictwie/BUD.25/" class="footer-link"> <span>BUD.25</span> <small class="text-muted">(943)</small> </a> </div> <div class="col-6"> <a href="/technik-pojazdow-samochodowych/MOT.02/" class="footer-link"> <span>MOT.02</span> <small class="text-muted">(813)</small> </a> </div> <div class="col-6"> <a href="/technik-transportu-kolejowego/TKO.07/" class="footer-link"> <span>TKO.07</span> <small class="text-muted">(321)</small> </a> </div> <div class="col-6"> <a href="/technik-drog-kolejowych-i-obiektow-inzynieryjnych/TKO.03/" class="footer-link"> <span>TKO.03</span> <small class="text-muted">(230)</small> </a> </div> <div class="col-6"> <a href="/technik-wiertnik/GIW.12/" class="footer-link"> <span>GIW.12</span> <small class="text-muted">(140)</small> </a> </div> <div class="col-6"> <a href="/technik-mechanik/MEC.05/" class="footer-link"> <span>MEC.05</span> <small class="text-muted">(340)</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-ochrony-fizycznej-osob-i-mienia/BPO.02/" class="footer-link"> <span>BPO.02</span> <small class="text-muted">(664)</small> </a> </div> <div class="col-6"> <a href="/technik-zywienia-i-usug-gastronomicznych/HGT.02/" class="footer-link"> <span>HGT.02</span> <small class="text-muted">(1 475)</small> </a> </div> <div class="col-6"> <a href="/technik-elektroenergetyk-transportu-szynowego/TKO.06/" class="footer-link"> <span>TKO.06</span> <small class="text-muted">(47)</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>