A. 做网站时如何让页面自适应大小
做网站让页面自适应大小方法代码如下:
一、电脑站设置网站自适应方法
全屏宽度主要在于CSS代码中,将width为100%,而不是一个固定的像素值,代码如下。
手机网设置网自适应方法:
在网页头部加上这样一条meta标签:<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
解释:
width=device-width :宽度等于设备屏幕的宽度。
initial-scale=1.0:表示:初始的缩放比例。
minimum-scale=0.5:表示:最小的缩放比例。
maximum-scale=2.0:表示:最大的缩放比例。
user-scalable=yes:表示:用户是否可以调整缩放比例。
B. 如何调整网页大小与屏幕适应
第一种方法:可以按着Ctrl键,然后滚动鼠标滑轮对网页大小进行调整。调整到与电脑屏幕大小相适应的程度即可。
第二种方法:点击浏览器右下角的缩放页面比例,然后对网页进行相对应的调整即可。
C. 如何让网页页面跟着浏览器窗口缩小而缩小
只要网页的页面是用百分比设置的,而不是用固定值设置的大小,都可以随浏览器窗口缩小而缩小,放大而变大。
D. 怎么可以使页面的大小随着屏幕大小而变化大小
需要使用CSS才可以做到,具体代码如下:
<styletype="text/css">.
bgimage{
position:fixed;z-index:-1;//这两句时最重要的,前
//句使图片始终显示在当前页,后一句是使图片显示在最底层。
}.
bgimageimg{heiht:100%;width:100%;}
</style>
E. 怎么让浏览器自动适应页面大小
方法一:按住ctrl键然后在滑动鼠标,向下滑是缩小,向上滑是放大。
方法二:点击浏览器的“页面缩放”,在移动到相应的比例就好。
方法三:浏览器现在设置里都有一个选项是适应屏幕。点击适应屏幕即可自动适应当前页面大小。
F. 网页怎么根据用户屏幕大小自动调整网页宽度
你可以在浏览器菜单栏当中选择【查看】,【查看】里面有个【网页缩放】,你可以在【网页缩放】当中进行调整适合屏幕的宽度,多尝试几次就可以设置好了。设置好之后,你以后每次使用浏览器的时候,它的宽度都是你自己设置的好的宽度,是不会变动的了。
G. 如何让网页自适应屏幕大小
1.首先,在网页代码的头部,加入一行viewport元标签。
viewport是网页默认的宽度和高度,上面这行代码的意思是,网页宽度默认等于屏幕宽度(width=device-width),原始缩放比例(initial-scale=1)为1.0,即网页初始大小占屏幕面积的100%。
所有主流浏览器都支持这个设置,包括IE9,对于那些老式浏览器(主要是IE6、7、8),需要使用css3-mediaqueries.js。
2、不使用绝对宽度由于网页会根据屏幕宽度调整布局,所以不能使用绝对宽度的布局,也不能使用具有绝对宽度的元素。这一条非常重要。具体说,CSS代码不能指定像素宽度:width:xxx px;
只能指定百分比宽度:width: xx%;或者width:auto;
3、相对大小的字体
字体也不能使用绝对大小(px),而只能使用相对大小(em)。
body {
font: normal 100% Helvetica, Arial, sans-serif;
}
上面的代码指定,字体大小是页面默认大小的100%,即16像素。
h1 {
font-size: 1.5em;
}
然后,h1的大小是默认大小的1.5倍,即24像素(24/16=1.5)。
small {
font-size: 0.875em;
}
small元素的大小是默认大小的0.875倍,即14像素(14/16=0.875)。
H. 如何让网页在浏览器自适应屏幕大小
方法:
1、在网页头部加上这样一条meta标签:<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
解释:
width=device-width :宽度等于设备屏幕的宽度
initial-scale=1.0:表示:初始的缩放比例
minimum-scale=0.5:表示:最小的缩放比例
maximum-scale=2.0:表示:最大的缩放比例
user-scalable=yes:表示:用户是否可以调整缩放比例
另外:如果想控制字体的大小的话,应该使用相对大小,可以用下面这段代码,一般不用也可,这里只是说明一种方法。
相对大小的字体
字体也不能使用绝对大小px,而只能使用相对大小em。
body {font: normal 100% Helvetica, Arial, sans-serif;}
上面的代码指定,字体大小是页面默认大小的100%,即16像素。
h1 {font-size: 1.5em; }
然后,h1的大小是默认大小的1.5倍,即24像素(24/16=1.5)。
small {font-size: 0.875em;}
small元素的大小是默认大小的0.875倍,即14像素(14/16=0.875)。
2、让网页适应不同的浏览器
浏览器的格局现在是两分天下,一分是IE,另一分是NetScape,在国内Ie有绝对的占有率,在这种情况下我们设计的网页只要兼容它就行了,但NetScape在国外还是有很多人使用,毕竟它是浏览器的元老。
虽然没有办法做出让所有浏览器都兼容的网站,但只要注意以下几点,做出来的网页在各个浏览器都中能达到比较好的显示效果:
a、不要混合使用层和表格排版,如果是父子关系,如层中表格,不在此原则范围内。
b、内联式的 CSS 在 Netscape Navigator 中经常会出现问题,使用链式或内嵌式。
c、有时需要在空层插入表格或者透明图片,以保证在 Netscape Navigator 里的效果。
d、对于只有几个像素宽度或高度的层,改用图片来实现。
e、避免使用 W3C 组织不推荐的排版属性,用 CSS 代替。