html全屏显示auto100%,css中width、height中auto与100%的区分

(1)width、height使用固定值是一定会显示的,但是除非是小型项目或是特殊情况,最好不要使用固定值。不利于响应式开发,当从移动端看页面就会非常不美观。

(2)不设置width、height时默认为auto,当position不同时显示效果不同,浮动可能会导致其不显示,需要清除浮动。

width:auto表示宽度是可变动的,这个div的所有部分(content+margin+padding+border)相加为父元素的width大小,。

height:auto表示高度可变动的,如果div设置了auto但是却没有显示有三种可能:

①cotent里没有能将其height支撑的子元素

②由于定位和浮动导致其不显示,清除浮动或修改定位

注:width:auto会占据一整行但是不会出现滚动条

(3)width、height:100%强制将子元素充满父元素的content。

width:100%子元素的width值为父元素的width值,加margin时不改变子元素width值大小,而是溢出父元素。

height:100%不显示的原因可能为没有设置父元素的height,可以通过将父元素的height设为固定值或是将父元素及父元素的父元素设置height:100%显示。

注:width:100%时使用margin,出现滚动条,在IE6下显示不正常

auto与子元素有关,100%与父元素有关

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值