这个需要css3来控制了页面代码ltdiv class=quotbgImgequotltdiv 样式bgImge width100%div的宽高一定要给指定height100%background url背景图路径 norepeat center centerbackgroundsize 100% 100%这里是背景图片的大小，用百分比表示就可以随div的大小改变了；高度的自适应父div高度随子div的高度改变而改变1如果父div不定义height子div均为标准流的时候，父div的height随内容的变化而变化，实现父div高度随子div的高度改变而改变代码ltstyle type=quottextcssquot aa border#000000 solid 5px bbborder#00ffff solid 5px cc border#；例如，如果需要在中插入一张图片，并希望该图片能够自适应div的尺寸，可以使用以下CSS代码s_img maxwidth 100%height auto 此代码段确保了图片在不同大小的屏幕上都能正确显示，不会出现拉伸或变形的情况当然，这种方法不仅可以在外部CSS文件中定义，也可以直接嵌入到HTML页面的。

divheight100%backgroundcolor#ccc**把你DIV的高度设置成100%** CSS代码第二种写法 divheight100%positionabsolutewidth100%backgroundcolor#cccleft0top0 这里用到positionabsolute所以HTML和BODY不需要设置100 大div套多个小div，怎样设置外div的高度自适应在最后；图片自适应屏幕大小显示主要是利用百分比来控制，切忌给图片宽度一个固定值如下代码html代码pimg src=quot图片地址quotalt=quotquotp此时的css可以写成imgboximgwidth100%这样，图片的大小就会根据其父级容器的大小而变化，图片的宽度只设置百分比，这样可以根据浏览器窗口的大小变化而随时调整。

ltdiv style=quotclear bothquotltdiv 这行代码在父容器中创建了一个清除浮动的区域，确保后续内容不会受到之前浮动元素的影响另一种方法是增加一个容器，这个容器在代码中存在，但在视觉上不可见这种技术常用于需要保留页面结构但又不希望影响视觉效果的场景例如ltdiv style=quotvisibility hidden；使html中div内的图片随屏幕大小调节的操作方法为，将div与img的宽度都设置为100%，代码如下lt！DOCTYPE html PUBLIC quotW3CDTD XHTML 10 TransitionalENquot quot lthtml xmlns=quot ltheadltmeta；现在先看看只是div背景图平铺repeat的效果，因为默认是repeat的，所以去除norepeat就行，效果如下图 下面是body和div的样式代码 body style=#34backgroundurl12jpg norepeat#34 div style=#34backgroundurl12jpg margin50pxheight790pxwidth1300pxborder2；最小高度均为200px，当内容较少时DIV盒子的最小高度为200px，当内容比较多超出高度能装下时，DIV盒子自适应高度，为了便于观察与参考分析，我们统一设置宽度为100px，一个黑色1px CSS边框CSS代码如下div_height200px minheight200px border1px solid #000 width；ltdiv class=quotleftquotltdiv ltdiv class=quotrightquotltdiv ltdiv 接着，为左右两栏分别设置宽度和高度left width 50% height 100% backgroundcolor #f0f0f0 right width 50% height 100% backgroundcolor #e0e0e0 这样，左右两栏的高度就能自适应内容的；样式代码如mydiv border1px solid #ccc为了测试用 maxheight300px 最大高度，在ie7等浏览器有效 heightexpressionwidth300？quot300pxquotheight+quotpxquot 在ie6有效 overflowyauto 滚动条自动，小于300没有滚动条，大于300出现滚动条；分析如下1页面大的时候它也变大但是大到它本身的尺寸的时候，再扩大页面它就不大了设置最大宽高为图片的宽高~代码如下ltdiv style=quotmaxwidth395px maxwidth744pxquotltimg src=quotimageszs_img01gifquot style=quotwidth100% height100% quot ltdiv 2例子ltdiv style=quot；很简单，写个div的样式，宽度固定，高度自适应就行，代码如下ltdiv style=quotwidth750pxborder1px solid #cccquot 内容自适应ltdiv。

css上从上到下由左向右执行的如果两个css一样，那么位于下面的css会代替掉上面的css，右边的会覆盖掉左边的例子 left width100px width200px 这样写left的宽度是200px如果在下面加上一行 left width300px 那么left宽度就是300px；在网页设计中，我们经常需要让元素的宽度和高度根据浏览器窗口大小自适应调整这可以通过CSS的百分比单位来实现具体来说，设置的宽度和高度属性为100%，可以让它们跟随浏览器窗口的宽度和高度进行调整假设我们有一个未添加任何CSS样式的元素，我们可以直接在HTML代码中定义一个空的标签，如下所示ltdiv；早期网站在设计时，由于设计程序浏览器版本以及移动设备的不普及，对网站没有专门进行所谓的“一站式”设计，及PC手机平板等专门优化设计，导致手机平板访问体验不佳的情况手机网页中有个DIV，怎么设置其背景图片自适应在DIV上因为电脑和手机分辨率的差异，这时候你要用比手机上显示的图片大两。