img{

max-width:100%;
  height:auto;

}

如题。

用max-width来防止图片溢出---不兼容ie6-----将max-width设置成父元素的宽度,当图片过大时会换行,以及限制图片的宽度。但是如果使用table,仍然可能超出限制。的更多相关文章

  1. css中:如何让一个图片(不知道宽高,宽高可能比父元素div大),在父元素div内部水平垂直居中,并且不溢出父元素div,且图片不拉伸变形(可等比例缩小)?

    欢迎进入:http://www.jscwwd.com/article/list/%E5%85%A8%E9%83%A8 效果图: 不管父元素的宽高怎么变化,图片都是水平垂直居中的,并且不溢出父元素. 注 ...

  2. 水平垂直居中图片及文字(兼容IE6+)实例

    直接看代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <me ...

  3. 都是以父元素的width为参照物的

    本文依赖于一个基础却又容易混淆的css知识点:当margin/padding取形式为百分比的值时,无论是left/right,还是top/bottom,都是以父元素的width为参照物的!也许你会说, ...

  4. 图片溢出div问题的最终解决方案

    2016.11.20备注: 此问题通过css的max-width:100%;即可解决. 前两天编写了一个前端页面,在本机上显示一切正常.不过在不断的测试中,发现了一个严重的问题,如果图片过大,会撑破d ...

  5. div 中图片溢出问题及 CSS3中图片翻转问题

    如果设置一个div 装两张以上的图片,如果不设置好div的宽度和高度,就会使图片溢出. 我们知道,div是可以由图片撑开其宽高的,也就是说如果只放一张图片的情况下,不设置div的宽高,div的宽高会默 ...

  6. div宽度设置width:100%后再设置padding或margin超出父元素的解决办法

    div宽度设置width:100%后再设置padding或margin超出父元素的解决办法 一.总结 一句话总结:直接加上box-sizing:border-box;即可解决上述问题. 1.box-s ...

  7. 向上下左右不间断无缝滚动图片的效果(兼容火狐和IE)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 关于子元素的margin-top溢出和元素浮动对父元素高度影响解决方案

    以下是个人学习笔记,仅供学习参考. 1.关于子元素的margin-top作用在无margin-top-border的父元素上导致子元素的margin-top溢出问题. 在给没有margin-top-b ...

  9. 图片水平垂直居中(兼容IE6,IE7,firefox,opera,safari,其中图片可以是任何块元素)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. MongoDB的C#驱动程序教程(译) 转

    1.概述 本教程是10gen支持C#驱动程序MongoDB的介绍.假定您熟悉使用MongoDB,因此主要集中在如何使用C#访问MongoDB的. 它分为两个部分:C# 驱动程序 ,BSON图书馆.C# ...

  2. Canopy测试IPython控制台输出

    Canopy测试IPython控制台输出

  3. (转)iphone数据存储之-- Core Data的使用

    原文:http://www.cnblogs.com/xiaodao/archive/2012/10/08/2715477.html iphone数据存储之-- Core Data的使用(一)   一. ...

  4. 2016 - 1 -17 GCD主队列与全局队列

    一:主队列 1.概念:每一个应用程序对应唯一一个主队列,直接GET即可:在多线程开发中,使用主队列更新UI dispatch_queue_t q = dispatch_get_main_queue() ...

  5. linux添加动态库搜索路径

    在有时运行程序出现动态库找不着的问题,而明明装了的.这时候可能是没有将相应的路径添加到系统中去. 具体说:cd /etc/ld.so.conf.d/ 可以发现里面有一堆*.conf的文件 我们要做的就 ...

  6. @font-face usage

    If you haven’t been living in a cave for the past few months, you will have heard lots of talk about ...

  7. Python ~~~ 面向对象的利器

    class Rectangle(): # 有没有括号都行 . def __init__(self,x,y): self.x=x self.y=y def getPeri(self): def getA ...

  8. PHP面向对象中常用的关键字和魔术方法

    PHP面向对象中常用的关键字 final        1.final不能修饰成员属性(类中常量不是用这个关键字)        2.final只能修饰类和方法 作用:            使用fi ...

  9. Juniper SRX防火墙-NAT学习笔记!

    Junos NAT第一部分:SRX NAT介绍第二部分:Source NAT:Interface NAT第三部分:Source NAT:Address Pools第四部分:Destination NA ...

  10. [转载]Magento 店铺多语言设置

    本文以扩展中文包为例: 首先进入自己 Magento 后台 系统 -> 管理商店(System -> Manage Stores) 单击 “创建店铺视图”(Create Store Vie ...