当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 完美网页应该适应不同人群

CSS样式表
CSS 表单元素不继承body的字体属性
网页制作学习教程 CSS Position
网页设计学习教程 CSS盒模型
vertical-align 表单元素垂直对齐的解决方法
不用Cookie的仿刷新二级高亮菜单
CSS3 优势以及网页设计师如何使用CSS3技术
CSS 网页制作 提高CSS可阅读性
CSS 样式表中引用图片地址在各浏览器中的差异
CSS Sprite优化 减少HTTP链接数
网页制作中应用的50个CSS技巧(国外)
CSS 英文教程 CSS语法
CSS 网页文字渐变效果
纯css 圆角实现代码
CSS 新的图像替换方法
不必需的样式脚本文件导致页面不能及时更新
CSS 约定写法 利用扩展
最全的CSS浏览器兼容问题小结
CSS 网页图文混排的10个技巧
IE的CSS制作网页技巧3则
创造100% 自适应css布局的行之有效的方法

CSS样式表 中的 完美网页应该适应不同人群


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-09   浏览: 109 ::
收藏到网摘: n/a

这两天伤到腰,医生让我躺卧休息一周,避免坐立。躺着看着电脑,把鼠标键盘加了延长线,放到腿上。看着屏幕上的字倍感吃力。因为字小,完全看不清楚。用Ctrl+鼠标中键进行滚动,发现很多站点用的都是pt和px字体CSS定义。滚动根本就无效……回看自己的个站,字体滚动是支持了。

标准:

引用代码
  1. body {
  2. text-align:center;
  3. height:100%;
  4. font-size: 75%;
  5. line-height: 1.5em;
  6. font-family: Verdana, MingLiu, Arial, Helvetica;
  7. }

IE Hack:

引用代码
  1. body {
  2. text-align:center;
  3. height:100%;
  4. font-size: 80%;
  5. line-height: 1.5em;
  6. font-family: Verdana, MingLiu, Arial, Helvetica;
  7. }

因为两种内核的浏览器的差别所以分开写了两种字体大小。觉得滚动后页面效果错乱,很不美观。就想起了自己当初的一个思路,将所有的相关的宽度高度单位都换算成以字体(em)为单位。(当初是因为看了yahoo的网站萌发的念头)。于是着手修改。修改的量不算很大,基本上就是一个等式:em宽度=PX宽度/12。很快,大约10分钟就全部修改完了。鼠标滚动缩小后得下图:(可使用iframe做站点缩略图用)

demo

完美的网页应该是适应不同人群的,让正常视力的人可以看到正常的效果,对于弱视的人或者像我一样躺在床上的人也是应该可以看到一种最合适观看的效果。正如这些人群是平等享有自身的权利。或者有人觉得这不是必要的。但不尝试过社会最底层的人民的苦楚,又怎么会体谅而且尊重他们。若不尝试过视力的模糊和这种躺在床上看电脑的感觉,你又怎么会觉得这些东西对那样的人群是多么的有用呢?如果你仍然觉得这些咚咚没有必要,那我真的希望你在不久的将来可以享受一下:P