媒体查询由什么和什么组成？手写媒体查询
老铁们，大家好，相信还有很多朋友对于媒体查询由什么和什么组成和手写媒体查询的相关问题不太懂，没关系，今天就由我来为大家分享分享媒体查询由什么和什么组成以及手写媒体查询的问题，文章篇幅可能偏长，希望可以帮助到大家，下面一起来看看吧！
前端面试媒体查询怎么说
1、什么是媒体查询
媒体查询可以让我们根据设备显示器的特性（如视口宽度、屏幕比例、设备方向：横向或纵向）为其设定CSS样式，媒体查询由媒体类型和一个或多个检测媒体特性的条件表达式组成。媒体查询中可用于检测的媒体特性有 width、 height和 color（等）。使用媒体查询，可以在不改变页面内容的情况下，为特定的一些输出设备定制显示效果。
2、为什么响应式设计需要，媒体查询
如果没有CSS3的媒体查询模块，就不能针对设备特性（如视口宽度）设置特定的CSS样式
3、如何在CSS文件中引入媒体查询
媒体查询写在CSS样式代码的最后，CSS是层叠样式表，在同一特殊性下，靠后的的样式会重叠前面的样式
4、怎样使用media
一、
首先需要在html文档中添加以下代码，用来兼容移动设备的显示效果
<meta name="viewport content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
ps:
width=device-width:宽度等于当前设备的宽度
initial-scale=1：初始的缩放比例（默认为1）
maximum-scale=1：允许用户缩放到得最大比例（默认为1）
user-scalable=no：用户不能手动缩放
二、怎样在CSS文件中写CSS响应式媒体查询
例:
@media screen and(max-width:720px) and(min-width:320px){
body{
background-color:red;
}
@media screen and(max-width:320px){
body{
background-color:blue;
}
}
ps:该段媒体查询的意思是：当设备屏幕宽度在320px——720px之间时，媒体查询中body的背景色（background-color:red;）会重叠之前的body背景色，当设备屏幕宽度在320px以下时，媒体查询中body的body背景色（background-color:blue;）会重叠之前的body背景色
立式触控一体机与触摸查询系统有什么好处
触控一体机与触摸查询系统提供给客人便捷、智能、安全的查询服务，同时减轻柜台窗口工作人员的工作压力，并很好提高整体形象以及服务的质量。
在日常立式触控一体机与触摸查询系统对大众市民有什么好处?
cmyitiji.com
信息公开：市民关注的是与自己相关的事情，无非更关注的是该企业或单位等最新的动态信息，有了触摸查询系统在后台更新信息，即可在触摸屏系统前看到该企业或单位的最新资讯或法规政策，对于政务信息公开增添了市民查询的窗口。
查询指南：市民前来办事都不知道相关流程准备的资料，需要多次往返的问然后去准备资料，期间办事效率低下，并消耗时间很长。相关查询指南可以在触摸软件内制作，市民直接到触摸查询一体机查询相关资料和步骤，让市民更充分了解到他办的事需要的资料和流程细节，无需排队询问和减少工作人员的压力。
查询便捷：多媒体查询软件可以介绍企业单位信息、企业特色优势、公开信息查询等功能，解决传统的大事小事都去排队问问题，只需要透过触摸屏的人机交互即可查询到自己需要信息，同时减少纸质印刷造成浪费。
在目前信息化高速的时代，多媒体触摸查询系统已成为人们必不可少的一种查询方式，不但大大减少其人员工作量外，带来更多的是市民可以便捷、直观、智能的好处，为企业或政务与人民群众之间有互动联系。
响应式和自适应有什么区别
1、自适应
自适应布局是网页内容根据设备的不同而进行适应；通过检测视口分辨率，来判断当前访问的设备是PC端、平板还是手机，从而请求服务层，返回不同的页面；需要根据不同使用场景开发多套界面。
2、响应式
响应式布局是网页的布局针对屏幕大小的尺寸而进行响应；通过检测视口分辨率，针对不同客户端在客户端做代码处理，来展现不同的布局和内容；只需要开发一套界面即可适用于所有尺寸及终端。
3、区别
比较直观的不同是：自适应：需要开发多套界面；响应式开发一套界面
自适应设计通过检测视口分辨率，来判断当前访问的设备是：PC端、平板、手机，从而请求服务层，返回不同的页面；响应式设计通过检测视口分辨率，针对不同客户端在客户端做代码处理，来展现不同的布局和内容。
自适应对页面做的屏幕适配是在一定范围：比如PC端（>1024）一套适配,平板（768-1024）一套适配，手机端（<768）一套适配;响应式一套页面全部适配。（可以想象：响应式设计要考虑的内容要比自适应设计复杂的多）
4、学习渠道
不管哪种设计方式，都要学习基本的WEB布局，比如流式布局、定位布局、浮动布局、flex布局、grid布局等，另外还要学习@media媒体查询，视口等相关知识，这个可以从W3C官网查看资料。另外也可以学习前端框架，许多框架都支持响应式布局，比如bootstrap等。
文章到此结束，如果本次分享的媒体查询由什么和什么组成和手写媒体查询的问题解决了您的问题，那么我们由衷的感到高兴！