html软件手机屏幕大小 html怎么手机自适应屏幕大小

解决方案1：

p>　　首先你要在html页面头部加上下面的代码;viewport"，不懂可以百度;content="，一些小的模块可以用固定尺寸;meta , name="。再就是css中要应用到媒体查询，不能不用固定尺寸。

</>，其次你要把页面中的宽度修改为百分比;width=device-width; ，也就是@media;initial-scale=1"

解决方案2：

建议你看一下网上的教程或者案例，自己对比学习再写。

建议：如果是小白的话，要不然不会自适应屏幕大小的，只要你编写的html代码符合html5规则就行html5不是转化的，建议你看一下html5标签文档

解决方案3：

看你之前是怎么做的，最好都调整成百分比的，这样最省事。

html里，如果让背景图片根据屏幕大小铺满屏幕，不重复？

css3支持，background-size:cover

html页面 自适应pc端 屏幕大小 怎么设置

使用媒体查询，参考bootstrap里面的设置，或者直接使用bootstrap框架吧，根据浏览器的宽度自动设置宽度的

媒体查询代码实例

@media only screen and (max-width: 500px) {

.gridmenu

{

width:100%;

}

.gridmain

{

width:100%;

}

.gridright {

width:100%;

}

}

网页要让它自适应各种手机屏幕宽度大小要怎么设置？

1. 在网页代码的头部，加入一行viewport元标签。

   viewport是网页默认的宽度和高度，上面这行代码的意思是，网页宽度默认等于屏幕宽度（width=device-width），原始缩放比例（initial-scale=1）为1.0，即网页初始大小占屏幕面积的100%。

   所有主流浏览器都支持这个设置，包括IE9

2. 不使用绝对宽度由于网页会根据屏幕宽度调整布局，所以不能使用绝对宽度的布局，也不能使用具有绝对宽度的元素。这一条非常重要。

   只能指定百分比宽度

3. 相对大小的字体

   字体也不能使用绝对大小（px），而只能使用相对大小（em）。

怎么制作html5网站页面让它适应电脑和手机的尺寸

媒体查询语法：

@media screen and (max-width:960px){...}

@media screen and (max-width:768px){...}

@media screen and (max-width:320px){...}

<link rel="stylesheet" media="screen and (orientation:portrait) and (min-width:800px),projection" href="800wide-portrait-screen.css" />

注意：1，媒体查询之间使用逗号隔开；2，在projection之后，没有and，也没有任何特性/值的组合。没有后续表达式，意味着只要是projection就满足条件。

@media screen and (max-device-width:400px){......}

@import url("~~.css") screen and (max-width:360px);

（@import方法会增加http请求，影响加载速度。）

媒体查询能检测的特性（最长用过的是设备的视口宽度(width)和屏幕宽度(device-width)）：

widht：视口宽度

height：视口高度

device-width：渲染表面的宽度（设备屏幕的宽度）

device-height：渲染表面的高度（设备屏幕的高度）

orientation：检查设备处于横向还是纵向。

aspect-ratio：基于视口宽度和高度的宽高比。(16:9的显示屏可以定义为aspect-ratio:16/9)

device-aspect-ratio:和aspect-ratio类似，基于设备渲染平面宽度和高度的宽高比。

color：每种颜色的位数。例：min-color：16会检测设备是否拥有16位颜色。

color-index：色板的颜色索引表中的颜色数。值必须是非负数。

monochrom：检测单色帧缓冲区中每像素所使用的位数。值必须是非负整数。

resolution：用来检测屏幕或打印机的分辨率，如min-resolution：300dpi。还可以接受每厘米像素点数的度量值，如min-resolution：118dpcm。

scan：电视机的扫描方式，值可设为progressive（逐行扫描）或interlace（隔行扫描）。如720p p表示逐行扫描。

grid：用来检测输出设备是网格设备还是位图设备。

在上述所有特性中，除scan和grid之外，都可以使用min和max前缀来创建一个查询范围。例如：

@import url("~~.css") screen and (min-width:200px) and (max-width:360px);这样~~.css只会引入视口宽度介于200px至360px的显示屏设备。

在样式表的开头位置设置样式，以便适应所有涉及，然后使用媒体查询来进一步重写响应的部分。例如，先针对大视口设计(用户大多数情况下使用鼠标)，将导航链接设计成简单的文字链接；然后再针对较小的视口，使用媒体查询重写这部分样式，为拇指一族提供更大点击区域。

使用多个独立的文件会增加http请求数量，建议在已有的样式表中追加媒体查询样式。（https://github.com/scottjehl/Respond）是为IE8及更低版本增加媒体查询支持的最快的js工具。

阻止移动浏览器自动调整页面大小：

在html的<head>中插入一个<meta>标签。<meta>标签中可以设置具体的宽度(如px)或者缩放比例(如2.0 设备实际尺寸的两倍)。例如：<meta name="viewport" content="initial-scale=2.0,width=device-width">

<meta>标签还可以控制页面可缩放的范围，下面的代码允许用户将页面最多放大至设备宽度的3倍，最小压缩至设备宽度的一半。<meta name="viewport" content="width=device-width,maximum-scale=3,minimum-scale=0.5">

还可以禁止用户缩放，不过缩放是一个重要的辅助功能，所以很少禁用。<meta name="viewport" content="initial-scale=1.0,user-scalable=no"> user-scalable=no即禁止缩放。

w3c正尝试使用@viewport声明，不用在<head>中添加<meta>，不过要使用私有前缀，如@-o-viewport{width:320px}

针对不同视口宽度修正设计：

首先在css中为平板设备增加媒体查询，数值ipad的视口宽度为768px（横向1024px）

@media screen and (max-width:768px){

#wrapper{

widht:768px;

}

#header,#footer,#nav {

width:748px;

}

}

=============================这只是一部分笔记===========

推荐一本书 响应式Web设计：HTML5和CSS3实战.pdf

html页面怎样能够自适应电脑屏幕宽度？

< script language=JavaScript> 　　 < !－－ 　　 function redirectPage(){ 　　 var url800x600=〃index－ie.html〃; //定义两个页面，此处假设index－ex.html和1024－ie.html同change－ie.html在同一个目录下 　　 var url1024x768=〃1024－ie.html〃; 　　

if ((screen.width==800) ＆＆ (screen.height==600))　//在此处添加screen.width、screen.height的值可以检测更多的分辨率 　　 window.location.href= url800x600; 　　

else if ((screen.width==1024) ＆＆ (screen.height==768)) 　　 window.location.href=url1024x768; 　　 else window.location.href=url800x600; 　　 } 　　 // －－> 　　 < /script>　　 然后再在< body…>内加入onLoad=〃redirectPage()〃　　 最后，同样地，在< body>和< /body>之间加入以下代码来显示网页的工作信息：　　 企鹅号：前面九七三 中间四五四 后面两个零 　　 < script language=JavaScript> 　　 < !－－ 　　 var w=screen.width 　　 var h=screen.height 　　 document.write(〃系统已检测到您的分辨率为:〃); 　　 document.write(〃< font size=3 color=red>〃); 　　

document.write(w＋〃×〃＋h); 　　 document.write(〃< /font>〃); 　　 document.write(〃正在进入页面转换,请稍候…〃); 　　 // －－> 　　 < /script>

移动端web 怎么调整table使用各种手机屏幕的大小

设置width 100%就可以了，另外在html顶端，需要设置<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">

微信公众平台里的界面，怎么让它自适应手机屏幕尺寸？

你弄错了~

用于手机浏览的网站，要用符合HTML5规范的代码来写，传统制作网站的HTML是不支持的，你不管怎么调节宽度，都会显示的很小。

那标签是不是也需要使用HTML5的标签呢?

对的，刚一上手挺折磨人的。

转载请注明出处51数据库 » html软件手机屏幕大小 html怎么手机自适应屏幕大小