图片的三种处理方法

近日仔细翻了一遍《精通CSS高级web标准解决方案》，发现有一知识点之前没注意 ，特摘抄到此以便随时复习。

1、对于需要跨越大区域的图像，如站点页眉或品牌区域中的图像，可以考虑使用背景图像而不是图像元素。   随着branding元素的伸缩，背景图像或多或少会露出来一些。

#branding{

     height：171px;      background:url;

}

2、如果图像需要用作页面上的图像元素，那么将容器元素的宽度设置为100%并且将overflow属性设置为hidden,  这样当浏览器宽度变小时，图像右边会被截短，而不会随着布局伸缩。

#branding{

      width：100%；     overflow：hidden；

}

3、若希望图像随着浏览器大小变化而水平或垂直伸缩以免被剪切，可以将图像元素添加到没有设置任何尺寸的页面上，然后设置图像的百分比数，并且添加与图像宽度相同的max-width以避免像素失真。

#img{

    width：25%；     max-width:200px;  (图片的宽度为200px)； flort:left;   display:inline;    padding:2%

}

#new{

   width:68%;  flort：right;   display:inline;  padding:2% 2% 2% 0

}

有时间截图细说，新人一枚，请多指教~~

_________________________________________________________________