[已解决]html小彩笔求助自适应

MAXXZZ

大一小菜鸟 我们html作业用笔记本做出来的十四寸 测试机是十七寸 如果测试机上看是不是div和字体都会特别小 想请教大佬们怎么设置自适应 让网页div和文字自己适应屏幕大小

最佳答案

月排行榜 / 总排行榜

不二如是

2017-12-25 08:09:31

1、如果你指定字体大小了，不同屏幕，字体大小是一样的，只是布局会出现乱不乱的情况（DOM文档流是主要诱因）

2、自适应要有监听事件，原生的嫌麻烦（挺简单的），就用bootstarp之类的框架（假如你会）。

3、监听@media screen实现网页布局的自适应（自行百度，很简单的）

1. @media (min-width: 768px){ //>=768的设备 }
   
2. @media (min-width: 992px){ //>=992的设备 }
   
3. @media (min-width: 1200){ //>=1200的设备 }
   
4. 注意下顺序，如果你把@media (min-width: 768px)写在了下面那么很悲剧，
   
5. @media (min-width: 1200){ //>=1200的设备 }
   
6. @media (min-width: 992px){ //>=992的设备 }
   
7. @media (min-width: 768px){ //>=768的设备 }

复制代码

跳转到最佳答案楼层

不二如是

1、如果你指定字体大小了，不同屏幕，字体大小是一样的，只是布局会出现乱不乱的情况（DOM文档流是主要诱因）

2、自适应要有监听事件，原生的嫌麻烦（挺简单的），就用bootstarp之类的框架（假如你会）。

3、监听@media screen实现网页布局的自适应（自行百度，很简单的）

1. @media (min-width: 768px){ //>=768的设备 }
   
2. @media (min-width: 992px){ //>=992的设备 }
   
3. @media (min-width: 1200){ //>=1200的设备 }
   
4. 注意下顺序，如果你把@media (min-width: 768px)写在了下面那么很悲剧，
   
5. @media (min-width: 1200){ //>=1200的设备 }
   
6. @media (min-width: 992px){ //>=992的设备 }
   
7. @media (min-width: 768px){ //>=768的设备 }

复制代码

MAXXZZ

非常感谢 昨天晚上自学了 今天用到了