浏览器缩小页面，布局就乱了，怎么办？
我用的浮动布局，浏览器100%显示的时候没问题，但是一旦在浏览器中缩小页面，布局就乱了。本来是左边一个div，右边一个div，根据浮动，一行显示，但是缩小页面后，右边就下来了。整个页面乱七八糟。不知道为什么会这样，怎么解决呢？
åå ï¼
bodyä¸ä¸çº§çå ç´ cssä¸é½æfloatæµ®å¨ï¼èbodyç大å°æ¯éæµè§å¨çªå£å¤§å°æ¹åçï¼å½æµè§å¨çªå£ç¼©å°æ¶ï¼å ç´ å°±ä¼å¾ä¸æï¼è¿å°±æ¯åå æå¨
ä¸é¢ä¸¾ä¸ªä¾åï¼
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>zoom_CSSåèæå_webå端å¼ååèæåç³»å</title> <meta content="Joy Du(é£é¶é¾é¨), dooyoe@gmail.com" /> <meta content="www.doyoe.com" /> <style> div{ float: left; width: 500px; border: 1px solid red; height: 100px; } </style> </head> <body> <div></div> <div></div> </body> </html>
å½ä½ æè¿æ®µä»£ç æ¾å¨æµè§å¨å¹¶ä¸ææµè§å¨çªå£ç缩å°å°1000pxæ¶å°±ä¼å¾æï¼
解å³æ¹æ³ï¼
åªéå¨æµ®å¨çç¶çº§å ç´ ä¸æ·»å ä¸é¢çä¸ä¸ªåºå®çå ç´ å å«çå°±å¯ä»¥ï¼
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>zoom_CSSåèæå_webå端å¼ååèæåç³»å</title> <meta content="Joy Du(é£é¶é¾é¨), dooyoe@gmail.com" /> <meta content="www.doyoe.com" /> <style> .top{ width: 1190px; } .top div{ float: left; width: 500px; border: 1px solid red; height: 100px; } </style> </head> <body> <div> <div></div> <div></div> </div> </body> </html>
bodyä¸ä¸çº§çå ç´ cssä¸é½æfloatæµ®å¨ï¼èbodyç大å°æ¯éæµè§å¨çªå£å¤§å°æ¹åçï¼å½æµè§å¨çªå£ç¼©å°æ¶ï¼å ç´ å°±ä¼å¾ä¸æï¼è¿å°±æ¯åå æå¨
ä¸é¢ä¸¾ä¸ªä¾åï¼
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>zoom_CSSåèæå_webå端å¼ååèæåç³»å</title> <meta content="Joy Du(é£é¶é¾é¨), dooyoe@gmail.com" /> <meta content="www.doyoe.com" /> <style> div{ float: left; width: 500px; border: 1px solid red; height: 100px; } </style> </head> <body> <div></div> <div></div> </body> </html>
å½ä½ æè¿æ®µä»£ç æ¾å¨æµè§å¨å¹¶ä¸ææµè§å¨çªå£ç缩å°å°1000pxæ¶å°±ä¼å¾æï¼
解å³æ¹æ³ï¼
åªéå¨æµ®å¨çç¶çº§å ç´ ä¸æ·»å ä¸é¢çä¸ä¸ªåºå®çå ç´ å å«çå°±å¯ä»¥ï¼
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>zoom_CSSåèæå_webå端å¼ååèæåç³»å</title> <meta content="Joy Du(é£é¶é¾é¨), dooyoe@gmail.com" /> <meta content="www.doyoe.com" /> <style> .top{ width: 1190px; } .top div{ float: left; width: 500px; border: 1px solid red; height: 100px; } </style> </head> <body> <div> <div></div> <div></div> </div> </body> </html>
温馨提示：内容为网友见解，仅供参考
第1个回答 2014-10-18
你左右两边的宽度是多少，是像素还是百分比。
如果你定义定义的页面宽度是百分比，建议你定义布局其他宽度的时候都是用百分比。
如果你是除了页面定义100%，其他的都是定义的像素那么不用想，必须错屏没商量。
要是方便的话，不知道能不能代码发上来看看本回答被网友采纳
如果你定义定义的页面宽度是百分比，建议你定义布局其他宽度的时候都是用百分比。
如果你是除了页面定义100%，其他的都是定义的像素那么不用想，必须错屏没商量。
要是方便的话，不知道能不能代码发上来看看本回答被网友采纳
相似回答
