WorksheetsQuizz nr1 - HTML, CSS cz.1
Total questions: 25
Worksheet time: 14mins
IDE to inaczej
Środowisko do edycji kodu
Biblioteka HTML
Biblioteka CSS
Środowisko do testowania strony
Wskaż znacznik HTML, który nie wymaga zamknięcia
<body>
<html>
<br>
<head>
Wskaż wszystkie elementy blokowe
<div>
<span>
<img>
<p>
<h1>
Jeżeli wpiszemy wartość # dla atrybutu href znacznika <a> w ten sposób :
<a href="#"> Przycisk </a>
Otrzymamy :
Przycisk otwierający nowe okno
Przycisk zamykający aktualne okno
Przycisk, który nie przenosi na żadną stronę
Z jakimi znacznikami powiązany jest znacznik <li>?
<ol>
<ul>
<tr>
<td>
Ile posiadamy znaczników odpowiedzialnych za tworzenie nagłówków? (h1... )
4
3
6
7
Jaka jest różnica pomiędzy znacznikiem <h1> a <header>
Pomiędzy znacznik <h1> wpiszemy tekst nagłówka natomiast <header> tworzy sekcje nagłówka na stronie
Pomiędzy znacznik <header> wpiszemy tekst nagłówka natomiast <h1> tworzy sekcje nagłówka na stronie
Oba znaczniki mogą być wykorzystywane zamiennie
Znacznik <h1> Może być wykorzystany na stronie wyłącznie raz, natomiast <header> wiele razy
Ile atrybutów może posiadać znacznik HTML?
Nieskończenie wiele
Maksymalnie 10
Wyłącznie jeden
Czy wszystkie znaczniki HTML muszą występować w parach? (Posiadać rozpoczęcie i zakończenie)
TAK, Wszystkie znaczniki muszą posiadać rozpoczęcie i zakończenie
NIE. Nie wszystkie znaczniki muszą posiadać rozpoczęcie i zakończenie
Jak wygląda komentarz w HTML?
// KOMENTARZ
/* KOMENTARZ */
<!-- KOMENTARZ -->
{ KOMENTARZ }
Na ile sposobów możemy dołączyć plik .css do naszego projektu
Jeden
Dwa
Trzy
Cztery
Nadając znacznikowi HTML atrybut id, będziemy mogli odnieść się do niego w pliku .css na podstawie :
~ (Tyldy)
` (Gravisa)
# (Hashu)
. (Kropki)
; (Średnika)
Stylując konkretne znaczniki w pliku .css każdy z nich musi posiadać nadaną wcześniej klasę bądź id
Prawda
Fałsz
Do czego służy znacznik :
<input type="radio"/>
Tworzymy listę, w której możliwy jest wybór wyłącznie jednej opcji
Tworzymy listę, w której możliwy jest wybór więcej niż jednej opcji
Tworzymy polę w które wpisać możemy wyłącznie liczby
Tworzymy polę w które wpisać możemy cokolwiek
Każdy znacznik w HTML :
Może posiadać nieskończoną ilość zarówno id, jak i klas
Może posiadać nieskończoną ilość id, ale tylko jedną klasę
Może posiadać wyłącznie jedno id, ale nieskończoną liczbę klas
Może posiadać wyłącznie jedno id i wyłącznie jedną klasę
Wskaż ile klas ma znacznik poniżej :
<p class="_klasa czerwony NiebieskaObramowka duzy okragly"></p>
3
4
5
5
6
h2.niebieski
Taki zapis w .css sugeruje, że będziemy stylować :
Wszystkie znaczniki <h2> pomijając te z klasą niebieski
Wszystkie znaczniki <h2> które dodatkowo posiadają klasę niebieski
Wszystkie znaczniki <h2>
Wyłącznie znaczniki które posiadają klasę niebieski
Czym różni się element z atrybutem display: block od elementu z atrybutem display: inline-block
Można używać ich zamiennie, niczym
atrybut display : block daje możliwość modyfikacji szerokości i wysokości elementu, a inline-block nie
atrybut display : inline-block daje możliwość modyfikacji szerokości i wysokości elementu, a block nie
element z atrybutem display : block, może posiadać szerokość większą niż 100%, natomiast ten z atrybutem display: inline-block : nie
Co oznacza w cssie selektor * np.
* {
}
Oznacza, że będziemy stylować wyłącznie puste elementy
Oznacza, że będziemy stylować każdy element
Oznacza, że będziemy stylować tylko domyślne tagi HTML
Oznacza, że będziemy stylować wyłącznie tagi z id *
Do utworzenia tego przycisku wykorzystano atrybuty :
Background-color
Border
Transition
Text-decoration
Border-radius
Do stworzenia powyższego elementu na stronie wykorzystano znaczniki :
<option>
<select>
<arrow>
<button>
<input>
Przycisk po najechaniu zmienił wygląd jak na przykładzie powyżej, wykorzystano do tego :
Atrybut : newColor w css
Pseudoklasę :onChange
Pseudoklasę :hover
Atrybut : OutlineColor w css
Jak osiągnąć efekt poświaty po najechaniu na przycisk "do koszyka"
Atrybut border
Atrybut box-shadow
Atrybut outline
Atrybut background-color
Po kliknięciu na jeden z przycisków podświetlana jest widoczna fioletowa linia pod samym przyciskiem, możemy uzyskać taki efekt przy wykorzystaniu atrybutu :
Border
Border-Radius
Border-Top
Border-Bottom
Underline
W celu zamieszczenia ikon na stronie możemy wykorzystać :
Bibliotekę Bootstrap
Bibliotekę Animate.css
Bibliotekę FontAwesome
HTML Unicode
Wszystkie powyższe
