CSS3 媒体查询测验
CSS3 测验题
通过对CSS3 教程系统地学习，相信你已全面掌握 CSS3 媒体查询知识点，为了巩固所学的内容，我们准备了一个小测验。
通过这个测验，您可以检验自己对 CSS3 的掌握程度，发现可能需要进一步巩固的地方。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
1. 哪个CSS3媒体查询用于检测设备是否是横屏？
- @media (orientation: portrait)
- @media (orientation: landscape)
- @media (device: horizontal)
- @media (screen: wide)
2. 哪个CSS3媒体查询用于检测设备的最小宽度为768px？
- @media (width >= 768px)
- @media (min-width: 768px)
- @media (device-width: 768px)
- @media (max-width: 768px)
3. 哪个CSS3媒体查询用于检测高对比度模式的设备？
- @media (prefers-contrast: high)
- @media (contrast: high)
- @media (high-contrast: enabled)
- @media (display: contrast)
4. 哪个CSS3媒体查询用于检测暗色模式？
- @media (dark-mode: enabled)
- @media (color-scheme: dark)
- @media (theme: dark)
- @media (prefers-color-scheme: dark)
5. 哪个CSS3媒体查询用于检测设备的屏幕分辨率？
- @media (pixel-density: 300dpi)
- @media (resolution: 300dpi)
- @media (dpi: 300)
- @media (screen-resolution: 300dpi)
6. 哪个CSS3媒体查询用于检测设备的最大宽度为1024px？
- @media (width <= 1024px)
- @media (device-width: 1024px)
- @media (max-width: 1024px)
- @media (screen-width: 1024px)
7. 哪个CSS3媒体查询用于检测设备是否是触摸屏？
- @media (hover: none)
- @media (touch-enabled: true)
- @media (input: touch)
- @media (device-type: touch)
8. 哪个CSS3媒体查询用于检测设备是否是竖屏？
- @media (orientation: vertical)
- @media (screen: portrait)
- @media (device-orientation: portrait)
- @media (orientation: portrait)
9. 哪个CSS3媒体查询用于检测设备是否支持悬停效果？
- @media (hover: enabled)
- @media (hover: hover)
- @media (pointer: fine)
- @media (input: mouse)
10. 哪个CSS3媒体查询用于检测设备的宽高比？
- @media (ratio: 16/9)
- @media (width-ratio: 16/9)
- @media (aspect-ratio: 16/9)
- @media (screen-ratio: 16/9)
11. 哪个CSS3媒体查询用于检测设备的颜色位数？
- @media (color)
- @media (color-depth: 8)
- @media (bits-per-color: 24)
- @media (display-color: true)
12. 哪个CSS3媒体查询用于检测动画是否被用户设置为减少？
- @media (animation: reduced)
- @media (reduce-motion: true)
- @media (motion: none)
- @media (prefers-reduced-motion: reduce)