- 博客(14)
- 收藏
- 关注
RSS订阅原创 前台必须写
http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js">>
2013-05-10 07:34:06
434
原创 CSS详解(3)— —媒体类型
你还记得你所打印的第一个网页吗？你所打印出的网页也许使你很失望。你也许要问：为什么看起来很好的页面，打印出来却不怎么样。实际上，通过使用CSS2，并在你使用媒体类型的基础上，你能够选择不同样式的打印效果。那也就是说：你可以使你的页面在屏幕上以一种样式显示，而当打印时，显示不同的样式。所有这些，你只要使用@media。@media screen{BODY{background:black
2013-04-09 14:23:19
476
原创 所设置的wap移动网站不显示，为什么？
1.当screen 的宽度小于 1024 px 的时候，所有的img标签的宽度和高度定位为：128px@media screen and (max-width: 1024px) { img { width: 128px; height: 128px; } } 动态的改变窗口的大小会出发这个事件，会显示你你在各种情况下所设置的
2013-04-09 09:38:53
566
翻译 如何测试移动Wap网站效果？
测试媒体查询测试代码很重要。针对平板电脑和智能电话进行测试使测试变得更复杂，因为理想情况下您将有大量设备需要处理。幸运的是，无需拥有实际的设备，即可测量大多数查询。拥有真实的设备总是会更好，但出于本文的用途，使用简单的浏览器将有助于您理解查询的工作原理。本文所附带的ZIP文件包含一个范例文件（mediaqueries.html），该文件附加了3种不同的设计。使用范例文件执行以下调节测试。将
2013-04-07 15:19:53
713
原创 CSS详解— —媒体查询(2)
如何编写媒体查询要将媒体查询添加到media属性中，您可以使用表1中的媒体功能设置一个或多个条件。与CSS属性一样，在一个冒号后指定媒体功能的值。每个条件包含在圆括号中，使用关键字and添加到媒体声明中。例如：media="screen and (min-width: 401px) and (max-width: 600px)" 媒体查询是布尔值：它们要么为true，要么为false。
2013-04-07 15:16:05
868
翻译 width、device-width和viewport
媒体查询的一个最容易混淆的方面或许就是width和height与添加了前缀device-的类似值之间的区别。对于桌面和平板计算机，它们之间的区别很容易理解：width和height指浏览器视区的尺寸，而device-width和device-height指显示器的尺寸。不是每个人都会全屏运行他或她的浏览器，所以width和height是您需要使用的度量方法。移动浏览器将填满可用的屏幕，所以您可
2013-04-07 15:10:33
1845
翻译 wap网站实例
一、范例文件：mediaqueries.zip注意：这是Donald Booth最初编写的一篇文章的更新和扩展版。移动设备的快速普及完全颠覆了Web设计领域。用户不再仅在传统桌面系统上查看Web内容，他们越来越多地使用具有各种尺寸的智能电话、平板电脑和其他设备。Web设计人员的挑战是确保他们的网站不仅在大屏幕上看起来不错，在小型的电话以及介于它们之间的各种设备上看起来也不错。媒
2013-04-07 15:04:35
743
原创 学习网址
1、http://beforweb.com/ ：Be For Web |为网而生（1）http://beforweb.com/node/21（2）http://beforweb.com/node/21/page/0/22、http://www.infoq.com/cn/news/2011/12/introducing-media-queries#header_0 ：案例 (2
2013-04-07 14:41:15
435
原创 CSS详解(二)— —媒体查询(1)
在HTML4中，媒体样式表的写法是：在CSS3中，媒体查询（Media Queries）扩展了媒体类型功能，支持更为精准的样式表标签。媒体查询由媒体类型和若干表达式组成，表达式负责检查特定媒体特性的条件。通过使用媒体查询，我们不需要修改网页内容，就可以使文档显示适应特定的输出设备。媒体查询是一个逻辑表达式，其结果为真（true）或假（false）。如果媒体查询的媒体类型与用户客户端所在
2013-04-07 14:38:06
1033
原创 CSS详解(一)— —媒体类型
你还记得你所打印的第一个网页吗？你所打印出的网页也许使你很失望。你也许要问：为什么看起来很好的页面，打印出来却不怎么样。实际上，通过使用CSS2，并在你使用媒体类型的基础上，你能够选择不同样式的打印效果。那也就是说：你可以使你的页面在屏幕上以一种样式显示，而当打印时，显示不同的样式。所有这些，你只要使用@media。@media screen{BODY{background:black
2013-04-07 14:16:35
672
转载 CSS
进行到这里时，就开始变得有趣了。你可以再次依靠服务端功能检测，但这次是在单一网站的基础上进行优化，而不是重定向到另一个独立网站。有一些手机所支持功能的数据库可以参考，例如WURFL。它是以XML文件的形式开放的，你可以在设计优化内容之前，先通过它来查询设备所支持的功能。你还可以查询移动设备的UA字符串，找出这些设备的其他细节参数，例如是否有摄像头，屏幕尺寸是多少，以及它的语言种类等信息。 在
2013-04-07 10:22:16
437
转载 Meta
一、网页手机wap2.0网页的head里加入下面这条元标签，在iPhone的浏览器中页面将以原始大小显示，并不允许缩放。其中： width - viewport的宽度 height - viewport的高度 initial-scale - 初始的缩放比例 minimum-scale - 允许用户缩放到的最小比例 maximum-scale - 允许用户缩放到的最大比例 user-scal
2013-03-25 16:55:32
542
翻译 响应式设计(一)
在设计中经常遇到这几个问题：1.想要网站兼容手机、平板电脑、pc，就得为不同的设备定制不同的版本。2.想要网站的某些页面在宽屏显示器下一行显示更多的内容，又得为宽屏定制一个版本。3.很多人并不是在全屏的情况下浏览我们的页面，如果让页面随着浏览器宽度改变而相应的调整会不会比较好？有没有办法能有效解决这些问题呢？响应式Web设计(Responsive Web design)的理念是
2013-03-25 10:13:41
791
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人