css布局的流体和响应式站点计算

时间:2012-10-21 15:16:11

标签: html css responsive-design fluid-layout

如果我正在创建自适应网站,则大多数文字会提供初始像素大小。即:

Width = 940px
Target = 200px
target / Context = Result : 200 / 940 = etc etc

一切都很好。

问题在于,如果我想要一个流动的网站(增加非基于矢量的文本大小),我不确定人们是如何从初始宽度计算的。

我的工作基础是我已将正文中的字体大小重置为1em,其中包含HTML标记等中的各种其他修正。我可以猜测页面宽度为940px可能是60em之类的东西,但这似乎相当狡猾。

还有其他一些计算方法,或者我在这里遗漏了什么?

2 个答案:

答案 0 :(得分:4)

在这些情况下可以使用Percentange。

例如: 200 / 940~ = 21%;

并将其用作:

.a-class {
    width: 21%;
}

或者你可以参考@media查询。您可以为不同的文档大小定义不同的宽度。 http://css-tricks.com/css-media-queries/

答案 1 :(得分:1)