forked from WEB-IMB-WS2526/lab-development-imb
67 lines
1.0 KiB
Markdown
67 lines
1.0 KiB
Markdown
# Übungsblatt 13
|
|
|
|
*Für das gesamte Übungsblatt ist keine Abgabe erforderlich.*
|
|
|
|
## 1. Übung zu Responsive Design: Media Queries
|
|
|
|
**Frage:** Welche *Media Query* trifft auf welches Gerät zu?
|
|
|
|
a. Smartphone: 320 x 480px
|
|
|
|
|
|
|
|
b. Smartphone quer gehalten: 960 x 640px
|
|
|
|
|
|
|
|
c. PC-Bildschirm: 1600 x 900px mit Browserfenster: 800 x 500px
|
|
|
|
|
|
|
|
d. Tablet quer gehalten: 2048 x 1539px
|
|
|
|
|
|
|
|
1.
|
|
```css
|
|
@media screen
|
|
```
|
|
|
|
2.
|
|
```css
|
|
@media screen and (max-width: 800px)
|
|
```
|
|
|
|
3.
|
|
```css
|
|
@media screen and (orientation: portrait)
|
|
```
|
|
|
|
4.
|
|
```css
|
|
@media screen and (min-device-width: 900px)
|
|
```
|
|
|
|
5.
|
|
```css
|
|
@media screen and (min-width: 900px)
|
|
```
|
|
|
|
6.
|
|
```css
|
|
@media print and (min-width: 30cm)
|
|
```
|
|
|
|
7.
|
|
```css
|
|
@media screen and (max-device-height: 1400px)
|
|
```
|
|
|
|
## 2. Übung zu Barrierefreiheit
|
|
|
|
|
|
**Aufgabenstellung**: Gegen welche WCAG-Erfolgskriterien verstößt folgendes Web-Kontaktformular?
|
|
|
|
|
|
|