媒体查询

什么是媒体询问？很多企业在官网都有这样的专栏。这是什么意思？

移动设备的迅速普及彻底颠覆了网页设计领域。用户不再仅仅在传统的桌面系统上浏览网页内容，而是越来越多地使用智能手机、平板电脑和其他各种尺寸的设备。网页设计师面临的挑战是确保他们的网站不仅在大屏幕上好看，而且在小手机和各种设备上也好看。媒体查询是为不同设备提供不同风格的好方法，它为每种类型的用户提供了最佳体验。作为CSS3规范的一部分，mediaquery扩展了media属性的作用(它控制如何应用您的样式)。例如，多年来，人们经常通过指定media=rel=media=rel=

media=单色整数是单色缓冲区中每个像素的位数(如果不是单色，则值为0)；0)分辨率是输出设备每英寸的像素，代表一个整数，后跟dpi(每英寸点数)或dpcm(每厘米点数)逐行扫描或隔行扫描。不，电视设备使用的扫描过程是grid0或1。如果设置为1，则设备是基于网格的，例如只有一种固定字体的电传类型终端或电话显示设备(所有其他设备都是0)。表1中的前五个函数(宽度、高度、器件宽度、器件高度和方向)最有用。您可以添加min-和max-作为大多数函数的前缀，以表示最小值和最大值，如min-width和max-width。表1中的“最大/最小”列表列出了可以用这种方式修改的函数。

宽度、设备宽度和视口

媒体查询最令人困惑的方面之一可能是宽度和高度以及前缀为device-的类似值之间的差异。对于台式机和平板电脑来说，两者的区别很好理解:宽度和高度是指浏览器观看区域的大小，而device-width和device-height是指显示屏的大小。不是每个人都会全屏运行他或她的浏览器，所以宽度和高度是你需要使用的测量方法。移动浏览器将填满可用屏幕，因此您可能希望宽度和设备宽度相同。不幸的是，情况并非总是如此。大多数智能手机(包括Android、iPhone和WindowsPhone7)将宽度设置为约1000像素宽的标称可视区域(在iPhone和iPodtouch中，为980像素；WindowsPhone7使用1024像素)。图4显示了iPodtouch通常如何显示上图中的示例页面。

图4。默认情况下，现代移动设备会缩放网页以适应估计的查看区域。

即使附加到页面的样式表使用mediaquery根据min-width和max-width的值提供不同的样式，iPodtouch也会忽略这些样式并显示桌面版本，因为它的查看区域被认为是980像素宽。更令人困惑的是，iPhone、iPodtouch和iPad在计算宽度时不考虑方向，而其他设备则考虑。幸运的是，有一个简单的方法可以解决这个困惑。苹果公司设计了一种新的

通过@import和@media使用媒体查询

除了附加外部样式表时，在

@导入URL(phone.css

媒体查询也可以在样式表中使用，如下所示:

@媒体专用屏幕和(最大宽度:400像素){

#导航栏{

浮动:无；

宽度:400px

}

}

测试媒体查询

测试代码非常重要。针对平板电脑和智能手机的测试使测试变得更加复杂，因为理想情况下，您将有很多设备要处理。幸运的是，大多数查询可以在没有实际设备的情况下进行测量。拥有一个真实的设备总是更好，但是对于本文的目的，使用一个简单的浏览器将帮助您理解查询是如何工作的。本文所附的ZIP文件包含一个示例文件(mediaqueries.html),其中附有三种不同的设计。使用示例文件执行以下优化测试。完全打开浏览器窗口，您可以看到基本的站点设计(参见图1)。缩小浏览器窗口，输入各种设备的尺寸范围就能注意到变化。当输入代码中指定的尺寸范围时，样式将更改为平板电脑(图2)或手机(图3)的尺寸。例如，对于平板电脑，标题图像将变得更小，下面的独立区域将呈现不同的形式。对于手机风格，主中心图像消失，取而代之的是由更大的垂直按钮组成的菜单。每次窗口改变时，浏览器将检查媒体查询，例如当你调整它时，或者当你将手机从垂直旋转到水平时。

DreamweaverCS5.5中的媒体查询

DreamweaverCS5.5改进了Adobe在DreamweaverCS511.0.3更新中引入的媒体查询支持。新的媒体查询对话框可以帮助您创建和维护页面或整个网站的媒体查询(参见图5)。您可以从以下任何位置访问“媒体查询”对话框:修改>:媒体查询多屏幕预览面板>:媒体查询按钮多屏幕下拉菜单>:媒体查询右上角的选项菜单CSS样式面板CSS样式面板中的上下文菜单

图5。DreamweaverCS5.5中的“媒体查询”对话框

使用这个新对话框，您可以:创建多个介质查询。将媒体查询附加到当前页面，这将添加到一个或多个CSS文件的链接。创建一个站点范围内的媒体查询文件，该文件将添加一个指向集中式CSS文件的链接，该文件导入其他特定于设备的CSS文件。使用站点范围选项时，您可以链接到现有的CSS文件或从对话框本身创建新文件。“介质查询”对话框还会使用您添加的文本作为描述，在查询上方创建注释。此外，您可以选择使视口:最小宽度和最大宽度。“默认预置”按钮提供了一种快速开始使用媒体查询的方法。管理站点范围内的介质查询文件的另一种简便方法是使用“站点设置”对话框。现在有一个名为“站点范围的媒体查询文件”的字段(位于“高级设置”>“本地信息”中)，它指定了您的站点范围的媒体查询文件。一旦打开“介质查询”对话框，此处列出的文件将显示为站点范围选项。对于新的(甚至现有的)文件，您只需选择此选项，将站点范围的媒体查询文件应用到当前页面。注意:更改此文件不会自动更新所有网站文件。“介质查询”对话框提供了一种简化创建和管理介质查询的好方法。媒体查询是确定不同风格的目标设备的首选方式。从上面可以看出，它们不仅适用于智能手机，还可以用来控制任何屏幕的观感。

http://www.adobe.com/cn/devnet/Dreamweaver/articles/introducing-media-queries.html

手机app读取媒体和文件是指读取了手机中哪个文件夹里的内容？

当前自己个人进行开放时读取媒体和文件是根据当前自己个人在进行使用时的规定来进行判断，如果说你想要读取内部所产生的一些文件内容或者是链接，就会有指定性的寻找文件夹进行查看。

如何查看自媒体的收益？

点开或者西瓜视屏，我的，点开创作中心，就能看到详细创作收益了。