文本内部缩小在移动设备上,而div不

前端之家收集整理的这篇文章主要介绍了文本内部缩小在移动设备上,而div不前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有人知道这里发生了什么吗?我在歌剧,海豚和工厂的 android浏览器上测试过. (虽然现在似乎在歌剧上工作)

div不改变大小,但是文本以某种方式缩小以适应div的一部分.
反正要防止这个?

只是为了清楚,我试图在移动浏览器上实现与pc版本相同的外观.

由于问题似乎与浏览器有关,我如何强制文本占据整个div的宽度?我尝试将p标签设置为100%,没有成功.

div必须具有该宽度并在页面的左侧对齐.

*更新1:我在galaxy s4(以前在s2上尝试过)中尝试过以下代码,并在歌剧迷你和海豚上获得相同的错误.
可以使用opera mini simulator在线显示错误,您只需要在某个地方托管html文件.

*更新2:我相信问题的存在是因为当网页被加载时,它被加载到正常大小(像素),所以该段落只占页面的一小部分.然后,页面缩小,所有内容都适合页面,但文本不会扩展,它保留在该初始的小空间.

在电脑上,应该是:

我尽可能缩小代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-us">
<head>

<Meta content="text/html; charset=utf-8" http-equiv="Content-Type" />

<Meta content="" name="keywords" />
<Meta content="" name="description" />

<title></title>

</head>
<body>
<div style="width:1000px; margin-left:auto; margin-right:auto;" >

<div style="float:left; width:758px; background-color:aqua;">
<p>

Random text Random text Random text Random text Random text Random text Random text Random text 
Random text Random text Random text Random text Random text Random text Random text Random text 
Random text Random text Random text Random text Random text Random text Random text Random text  
Random text Random text Random text Random text Random text Random text Random text Random text  
Random text Random text Random text Random text Random text Random text Random text Random text  
Random text Random text Random text Random text Random text Random text Random text Random text  
Random text Random text .
<br />
<br />
Random text Random text Random text Random text Random text Random text Random text Random text  
Random text Random text Random text .
<br />
<br />
Random text Random text Random text Random text  
<a href="http://www.a.com/a.html">
Random text </a> Random text  
Random text .
</p>
</div>
</div>
</body>
</html>@H_403_21@ 
 

谢谢.

解决方法

更好地开始应用HTML5,以及适当的doctype:
<!DOCTYPE html>@H_403_21@ 
 

然后调整视口,因此可以应用:

<Meta name="viewport" content="width=device-width,initial-scale=1">@H_403_21@ 
 

我没有Opera Mini测试,但是根据兼容性表,它应该是工作.

原文链接:https://www.f2er.com/css/214374.html

猜你在找的CSS相关文章