使网页的一部分由不同的设备响应

时间:2017-03-17 05:55:35

标签: html css twitter-bootstrap

我的网页只包含3个部分:

1:第1部分,在左侧,它负责显示消息,它是一个小区域,并且与屏幕左侧“对齐”。

2:第2部分,在右侧,它是另一个区域,并且与屏幕右侧“对齐”。

3:第3部分,在中间,它是页面的“主要”区域,它由许多div标签与屏幕“固定”的元素组成。我真的认为我在这里使用了div

我已经通过手动修复(定义绝对位置和像素)那些div来使第3部分看起来很有条理。但是只有一个屏幕尺寸的电脑才能看起来不错。我希望使用mediaQuery使其对其他设备做出响应。但是因为我得到了这么多div,所以指定每个人的位置会很痛苦。 我可以用另一个div包装器包装整个第3部分然后只更改这个包装器位置吗?我试过但是我失败了。

还是有另一种有效的方法吗?我是开放的引导程序,但我找不到任何类似于我的设计的框架。而且我的设计非常简单,所以在没有模板的情况下完成它将是最好的。

第3节看起来像这样:

https://jsfiddle.net/9jpdw4f7/

0 个答案:

没有答案